Grow your CSS skills. Land your dream job.

Bugs on IE6 only, as always :(

  • # July 20, 2008 at 9:33 am

    I have started to style new web page, everything was alright till I opened IE6 (I was working with FireFox3 and Opera). And OMG?! Whats that, IE6 displaying it pritty bad :(. So how to make, that IE6 display the page the same as FireFox3 or Opera. How to fix these ‘bugs’? Thanks as always :)

    Site adress: http://www.test.klausyk.net/stat/index.html
    CSS: http://www.test.klausyk.net/stat/style.css

    P.s It looks like that IE6 dont understand the height, strange.. :/

    # July 20, 2008 at 5:48 pm

    I have managed to fix these bugs by my self. But I got a new one :P :/ . The list-style-image is displaying bad on IE6, Opera (it’s not centered or something). Its OK on FF 3, Safari, but not on other browsers. Look at the list, the arrow is not centered. So if you know how to fix it please let me know.

    Site adress: http://www.test.klausyk.net/stat/index.html

    # July 21, 2008 at 10:35 am

    Hmm.. No body knows or what? It’s very important for me :/ :(

    # July 21, 2008 at 11:03 pm

    List-style-image is almost always a bad CSS attribute to use. It has serious cross-browser issues that are difficult to account for. You are far better off setting a background image on your LI elements instead, as the positioning is consistent across browser that way.

    So instead of using:

    Code:
    cats ul {
    list-style-image:url(images/arrow.gif);
    }

    Use:

    Code:
    cats ul li {
    background: url(images/arrow.gif) left center no-repeat;
    padding-left: 20px; /* or whatever the width of the image is */
    }
Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".