Life, the Universe and the Internet

I discovered today that my bullet lists on my website digitallard.com were not displaying correctly in Internet Explorer 7. I should have checked it before but it’s one of those things that I keep meaning to do and never actually get around too. Anyway the bullet list in question uses a custom image as the bullet and although it looked fine in firefox, the display was all over the place in IE.

After much fiddling around with the CSS style sheet I eventually found the right combination of margins, etc that worked across both browsers. If your interested in seeing the final CSS code and I’ve attached it below. Hopefully it may be of help to you if you get the same problem:

.arrowlistbullet
{
    list-style-image: url(../Images/Icons/point_right.gif);
    list-style-type: square;
    list-style-position: outside;
    margin: 0px 0px 5px 20px;
}

I am actually referencing the code by calling the custom class in <li> code, as below:

<li class="arrowlistbullet">list item</li>