<center><p><font color="white">ss<p>ss
<div class="audun_warn">
   <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
  This text box is coded by <a href="http://audunport.tk" style="text-decoration:none;"><font color=#008cba> Audun</A>
</div>
  

<div class="audun_info">
<i class="fa fa-info-circle" aria-hidden="true"></i>
  This text box is coded by <a href="http://audunport.tk" style="text-decoration:none;"><font color=#008cba>Audun</A>
</div>

  
<div class="audun_success">
<i class="fa fa-check-circle" aria-hidden="true"></i>
  This text box is coded by <a href="http://audunport.tk" style="text-decoration:none;"><font color=#008cba> Audun</A>
</div>
/*****************************************************\
|  Error, Success, Warning, and Info Messages with CSS|
|  If you like it, please leave a heart or comment :D |
\*****************************************************/



@import url('//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css');

.audun_warn {
    color: #ffffff;
    background-color: #FF8080;
    font-family: 'Source Sans Pro', sans-serif;
    border-radius:.5em;
    border: 1px solid;
    margin: 10px 0px;
    padding:12px;
   width: 400px;
}

.audun_info {
    color: #ffffff;
    background-color: #79CFE0;
    font-family: 'Source Sans Pro', sans-serif;
    border-radius:.5em;
    border: 1px solid;
    margin: 10px 0px;
    padding:12px;
   width: 400px;
}

.audun_success {
    color: #ffffff;
    background-color: #7DDF7C;
    font-family: 'Source Sans Pro', sans-serif;
    border-radius:.5em;
    border: 1px solid;
    margin: 10px 0px;
    padding:12px;
   width: 400px;
}

/// If you are using this, i would like to have some of the credits. And please comment on this post if you use it :)

External CSS

  1. //maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.