title: Do not display alert again after user clicked dismiss(x) or refreshed the page
body: <p>I am trying to create an alert on website which will not show up again after user clicked dismiss(x). Basically if user clicked X and refreshed the page - the alert should not be displayed anymore. (Similar to cookies policy bar)</p>
  
  <p>Can someone let me know how to do it?</p>
  
  <p>So far I have:</p>
  
  <pre><code>&lt;div class="flash flash-warning alert alert-dismissible fade show" role="alert"&gt;
    &lt;span&gt;&lt;strong&gt;Shipping&lt;/strong&gt;  Flat and simple rates, check it out &lt;a href="#" style="color: white; text-decoration: underline;"&gt;here&lt;/a&gt;&lt;/span&gt;
    &lt;span class="closebtn" onclick="this.parentElement.style.display='none';"&gt;&lt;strong&gt;&amp;times;&lt;/strong&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And then CSS</p>
  
  <pre><code>.flash {
    padding: 5px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #2A92E5;
    color: white;
    box-shadow: 0 0 8px rgba(0,0,0,0.2);
  }
  
  /* The close button */
  .closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
  }
  
  /* When moving the mouse over the close button */
  .closebtn:hover {
    color: black;
  }
  </code></pre>