title: How to add a close button to alertify log with CSS?
body: <p>I'm trying to add this close button to my <a href="https://alertifyjs.org/" rel="nofollow noreferrer">alertify log message</a>. The final display should be something like this:</p>
  
  <p><a href="https://i.stack.imgur.com/be6ei.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/be6ei.png" alt="log message wit close button"></a></p>
  
  <p>I've tried a few solutions listed on SO but for some reason I'm not able to move the close button out of the <code>alertify log</code> message. The overflow for the close button is always hidden, and I've tried playing with the CSS settings but it is not working.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var fn = function() {
    alertify.log('How to add close button? &lt;a href="" class="close-icon"&gt;&lt;/a&gt;');
  };
  
  fn();</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.close-icon
  {
    position: absolute;
    top: -5px;
    right:-5px;
      display:block;
      box-sizing:border-box;
      width:20px;
      height:20px;
      border-width:3px;
      border-style: solid;
      border-color:black;
      border-radius:100%;
      background: -webkit-linear-gradient(-45deg, transparent 0%, transparent 46%, white 46%,  white 56%,transparent 56%, transparent 100%), -webkit-linear-gradient(45deg, transparent 0%, transparent 46%, white 46%,  white 56%,transparent 56%, transparent 100%);
      background-color:black;
      box-shadow:0px 0px 5px 2px rgba(0,0,0,0.5);
      transition: all 0.3s ease;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://rawgit.com/alertifyjs/alertify.js/master/dist/css/alertify.css" rel="stylesheet"/&gt;
  &lt;script src="https://rawgit.com/alertifyjs/alertify.js/master/dist/js/alertify.js"&gt;&lt;/script&gt;
  &lt;button onclick="fn();"&gt;
      &lt;span class="ui-button-text"&gt;Test&lt;/span&gt;
  &lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>