title: How can I change cursor for disabled <button> or <a> in Bootstrap 4?
body: <p>How can I use <em>cursor: not-allowed</em> on <strong><em>button</em></strong> or <strong><em>a</em></strong>? I tried the following:</p>
  
  <pre><code>.not-allowed {
       pointer-events: auto! important;
       cursor: not-allowed! important;
  }
  </code></pre>
  
  <p>My button looks like this:</p>
  
  <pre><code>&lt;a class="btn btn-primary btn-lg disabled not-allowed" href="https://www.example.com" role="button"&gt;Test&lt;/a&gt;
  </code></pre>
  
  <p>Without the pointer-events is activated, the cursor can not be changed. But if <strong><em>pointer-events: auto</em></strong>, the <strong><em>button</em></strong> or <strong><em>a</em></strong> is clickable. If the <strong><em>pointer-events: none</em></strong> the cursor doesn't change.</p>
  
  <p>Please help me, I despair!</p>