Today I learned a new trick, instead of using the list-style-image to declare your image in a list like so:ul {list-style-image:url("bullet.gif");} This method is limited in placing your image, because you can\’t move around where it appears. It will appear in place of the bullet and thats it. If you use background inside of the actual li declaration, then instead you can use the padding and margins to place your custom bullet point accordingly.Setup like this:ul {list-style-type:none;}ul li {margin:0px;padding:5px 0px 0px 10px;background: url (bullet.gif);}


0 thoughts on “List Items and Background Images”

Leave a Reply

Your email address will not be published. Required fields are marked *

Related Posts

Web

Angular JS Magazine on Flipboard

I have been working with AngularJS for about a year now, trying to learn as much as I can about this growing framework. It’s been a wild ride and I’m going to post a summary Read more…

Top 5

Top 5 Articles : Week of November 25

During the the week of November 25th, I really started to dive into Angular JS. My top 5 articles of the week are mainly about AngularJS, an MVC framework by Google. #1 : AngularJS WebInspector Read more…

eCommerce

How to implement Bronto Email JavaScript Conversion tracking in Google Tag Manager

This tutorial will show you how to setup Bronto Advanced JavaScript Conversion tracking using Google Tag Manager. Bronto Advanced JavaScript tracking gives you more visibility to all of the products that customers are purchasing, then Read more…