Getting rid of bullet points from

Question

I have the following list:

 <ul id="otis">
 <li>Benz</li>
 <li>Other Benz</li>
 <li>Other Other Benz</li>
 </ul>

I want to get rid the bullets so i tried:

 ul#otis {
 list-style-type: none;
 }

That didn't work though. What is the proper way to remove the bullets from the displayed list?

Answer 1

To remove bullet from UL you can simply use list-style: none; or list-style-type: none; If still not works then i guess there is an issue of priority CSS. May be globally UL already defined. So best way add a class/ID to that particular UL and add your CSS there. Hope it will works.

Answer 2

Assuming that didn't work, you might want to combine the id-based selector with the li in order to apply the css to the li elements:

#otis li {
    list-style-type: none;
}

Reference:

• list-style-type at the Mozilla Developer Center.

Answer 3

To remove bullet points from unordered lists , you can use:

list-style: none;

You can also use:

list-style-type: none;

Either works but the first is a shorter way to get the same result.

Answer 4

Put

<style type="text/css">
 ul#otis {
     list-style-type: none;
   }
</style>

immediately before the list to test it out. Or

<ul style="list-style-type: none;">

Answer 5

This worked perfectly HTML

<ul id="top-list">
        <li><a href="#">Home</a></li>
        <li><a href="#">Process</a></li>
        <li><a href="#">Work</a></li>
        <li><a href="#">Team</a></li>
        <li><a href="#">Contact</a></li>
      </ul>

CSS

#top-list{
  list-style-type: none;
  list-style: none;}

Answer 6

I had the same problem, and the way I ended up fixing it was like this:

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

Maybe it's a little extreme, but when I did that, it worked for me.

---

Hope this helped