Just a little labs site
(
You can edit the HTML and CSS fields to experiment with the styles
)
Pattern
Other
→
Using a List Image
item
item
item
item
HTML
<ul class="withArrows"> <li>item </li> <li>item </li> <li>item </li> <li>item </li> </ul>
CSS
ul.withArrows { /* turn off the default markers */ list-style: none; /* set indentation of list items */ margin-left: 0; padding-left: 15px; } ul.withArrows li { /* set the image as a background and move it down a little to align with the middle of the text */ background: url(/wp-content/uploads/2017/12/greenarrow2x.png) no-repeat 0 2px/16px 15px; /* move the text over to make room for the background image */ padding-left: 25px; margin-bottom:10px; }
hide
Fonts
