title: CSS3 animation fadeOut
body: <p>I'm trying to dissappear Bootstrap Alert after 3seconds. I made it, but it just dissapears and keeps the height of div. Can I remove that div with CSS only? I tried <strong>display:none;</strong> and it also didn't work. I need help. </p>
  
  <p>This is what I did:</p>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>.alert-success {
      -webkit-animation: fadeOut 3s linear forwards;
      animation: fadeOut 3s linear forwards;
  }
  
  
  @-webkit-keyframes fadeOut {
      0%   {opacity: 1;}
      70%  {opacity: 1;}
      90% {opacity: 1;-webkit-transform: translateY(0px);}
      100% {opacity: 0;-webkit-transform: translateY(-30px);}
  }
  </code></pre>
  
  <p><strong>HTML:</strong> </p>
  
  <pre><code>&lt;div class="alert alert-success"&gt;
     Well done! You successfully read this important alert message.
  &lt;/div&gt;
  </code></pre>
  
  <p>Thanks in advance</p>