CSS description list
In a definition list, each list item is labeled with a description.
Example
dt {
padding: .25em;
clear: left;
}
dd {
float: left;
width: 60%;
margin-left: 80px;
padding: .25em 0;
}
dt:before {
content: '\21E8';
color: #900025;
margin-right: 5px;
font-size: 20px;
}
dd:before {
content: url('resources/images/star3.png');
margin-right: 10px;
}
dd.water:after {
content: '\2665';
color: red;
margin-left: 5px;
}
dd.tea:after {
content: '\1F600';
color: red;
margin-left: 5px;
}
dd.coffee:after {
content: '\1F60D';
color: red;
margin-left: 5px;
}
Click on the "Try it Now" button to see how it works.