CODEWITHSUNDEEP
css
422
422

Reputation: 5770

icon and text inline css issue

Where have a i gone wrong here

ul.bullet { list-style-image:url('../images/bullet-blue-icon.png');vertical-align:middle;line-height:16px; }
ul.bullet li { line-height:16px;font-size:14px;}

The image is 16px x 16px

Should dispplay absolutley inline with the li text so like this

[ image ] text here

But the image is off cock, enter image description here

Upvotes: 0

Views: 532

Answers (1)

Dan
Dan

Reputation: 10351

Try setting the background image to the LI rather then the UL. Then set the background position for the image.

Something along the lines of:

ul{
list-style:none;
padding:0;
margin:0;
}

ul li{
background:url(image/path.png) left center no-repeat;
padding-left:20px;
}

I haven't tested it, but it should work. You can, of course, still have margin and/or padding on your UL if you wish - this is just for the example.

Upvotes: 4

Related Questions