Insert image after each list item
What would be the best way to insert a small image after each list element? I tried it with a pseudo class but something is not right...
ul li a:after {
display: block;
width: 3px;
height: 5px;
background: url ('../images/small_triangle.png') transparent no-repeat;
}
Thanks for any help!
Solution 1:
The easier way to do it is just:
ul li:after {
content: url('../images/small_triangle.png');
}
Solution 2:
Try this:
ul li a:after {
display: block;
content: "";
width: 3px;
height: 5px;
background: transparent url('../images/small_triangle.png') no-repeat;
}
You need the content: "";
declaration to give your generated element content, even if that content is "nothing".
Also, I fixed the syntax/ordering of your background
declaration.