css li spacing problem fixed

Sorry, geek post about css.

Let’s say you have a bullet gif that is 6 pixels high and you want to align it to your text in your bullet item. If you line it up right in ie, it won’t be right in firefox. This problem has been troubling me for years. I found a fix that appears to work.
Well, here’s a fix that will overrigt just the style in firefox, but ie will only use the first one.

#size_chart li {
    background-image: url(images/bullet.gif);
    background-repeat: no-repeat;
    background-position: 0 .8em;
    padding-left: .9em;
}

/* the following adds a little more padding to ie so it looks nice too */
*html #size_chart li {
    background-position: 0 1.1em;
}

Posted

in

by

Tags: