Insert image after each list item

Question

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

User · Answer

My solution to do this   li span show  after    content  url   sites default files new5 gif      padding-left  5px

User · Answer

I think your problem is that the  after psuedo-element requires the content  property set inside it  You need to tell it to insert something  You could even just have it insert the image directly   ul li after       content  url     images small triangle png

User · Answer

For IE8 support  the  content  property cannot be empty    To get around this I ve done the following     ul li after       content  icon       text-indent -999em      display block      width 32px      height 32px      background url    img icons spritesheet png  0 -620px no-repeat      margin 5  0 0 45       Note   This works with image sprites too

User · Answer

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

User · Answer

The easier way to do it is just   ul li after       content  url     images small triangle png

User · Answer

ul li   li before       content url imgs separator gif

[css] Insert image after each list item

Examples related to css