treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] How to remove bullets in IE8?

  • I have this in my wordpress header layout:
    		<div id="top-ad">
    <ul>
    <li class="top-ad-1"><?php /*Show ad 1 */ ?></li>
    <li class="top-ad-2"><?php /*Show ad 2 */ ?></li>
    </ul>
    </div>

    In my css file, i put these to handle the list:
    #top-ad {
    margin: 0 auto;
    }


    #top-ad li {
    display: inline;
    list-style: none;
    list-style-image: none;
    list-style-type: none;
    }


    FYI, the second list (top-ad-2), i show the Google Adsense 200x90 link ad.
    its ok in FF, Chrome, Safari but in IE, it still show bullets!

    i try to put all the list style in ul selector but the bullets are still there. anyone know how to deal this with IE?
  • Try:


    #top-ad ul {
    list-style: none;
    }
  • not working
  • Do you have a live example of the page or the entire site code?
  • currently i am working on localhost...the bullets is small but i dont know why CSS cannot make them remove
  • Might be overwritten by another style?

    Try:


    #top-ad ul {
    list-style: none !important;
    }
  • You can also try to be more specific like:

    #wrapper #sidebar #content #top-ad ul { list-style: none; }

    (or whatever the path is to that div)
  • do you mean i have to start from the earliest selector like header???

    TT Mark, the !important trick is not working as well. damn i hate ie
  • I'm not saying you have to, I'm saying it might help.

    Like Mark said above, without a link to the site, it's very hard for us to guess at what will help.
  • Try using a css reset. That should automatically 'disable' most browser specific styles.
  • i am trying..never know about css reset before..
  • Double check your code. Most likely an error or a style overriding it.
  • #top-ad ul {
    list-style-type: none !important;
    }
  • sidedesigner,

    like i said, the important tag is also not working
  • Can't you paste the entire page CSS and HTML?
  • try this out...

    #top-ad ul li {

    display: inline;
    list-style: none;
    list-style-image: none;
    list-style-type: none;

    }

  • Hi dzulfriday. What a lot of people here have suggested should work. It is possible that you have written your css the right way, but have also declared a global list-style-type some where below #top-ad li list-style-type. I would make sure that this is not the case. If you find it is still happening even after looking through your css for any overriding styles, I would try to get your css and html up somewhere for us to review it.

    -Mike
  • I had a similar situation. Oddly, when I selected the li directly using

    li { list-style-type:none; }

    and reloaded the page, the bullets did not display.

    Then, I took that li selector out. The descendant selector

    nav ul li { list-style-type:none; }

    then worked.

  • What I sometimes do is write a new style at the end of the css file. Then when it works, I'll move it to where I have stuff organized to. Then reload the page just to make sure it is still working.

  • Just so everyone is aware, this thread is over 2 years old.

  • I blame Andrew85!