We would like to know how to create Two column list with non-standard list marker.
<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
.two-col-special {<!--from w w w . j ava2s. c o m-->
border: 1px dotted blue;
margin: 0;
padding: 0;
}
.two-col-special li {
display: inline-block;
width: 45%;
margin: 0;
padding: 0;
vertical-align: top;
}
.two-col-special li:before {
content: '+';
padding: 5px;
margin-right: 5px;
color: orange;
background-color: white;
display: inline-block;
}
</style>
</head>
<body>
<ul class="two-col-special">
<li>First Category</li>
<li>Second Category</li>
<li>Third Category</li>
<li>Fourth Category</li>
<li>Fifth Category</li>
</ul>
</body>
</html>
The code above is rendered as follows: