Friday, 17 February 2012

How to align bullets with text in CSS using ul li

I've been going back and forth with searching and testing on how to align horizontally graphic bullets with text in CSS..

this is my code:

ul.links{
padding-left: 15px;
list-style-position: outside;
}

.links li{
padding: 5px 0px;
color: #16808C;
list-style-image: url(../images/layout/link_arrow.png);
text-align: left;
}

I can't figure it out as I tried changing the li with no luck.. is here a syntax error that I can't spot?

.links li{
padding: 5px 0px;
color: #16808C;
list-style-image: url(../images/layout/link_arrow.png) no-repeat center left;
text-align: left;
vertical-align: text-top;
background-position: 0 50%;
}

No comments: