Defines styles for success, warning and error messages.


To apply this feature, add the .css-alert class to a block element.


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore.

Close button

To apply a close button, add the .css-close-button class to a <a> element inside the alert box.

Color modifiers

There are three more color modifiers available. Just add one of the following classes to apply a different look.


To indicate success or a positive message add the .alert-success class.


To indicate a message containing a warning add the .alert-warning class.


To indicate an important message add the .alert-danger class.


<div class="css-alert alert-success">
	<a class="css-close-button" href="#alert-1"> </a>

This page has been viewed: 1611 time(s)