Removing "bullets" from unordered list <ul>

Question

I have set this:

list-style: none outside none; 

And HTML:

<ul class="menu custompozition4">     <li class="item-507"><a href=#">Strategic Recruitment Solutions</a>     </li>     <li class="item-508"><a href="#">Executive Recruitment</a>     </li>     <li class="item-509"><a href="#">Leadership Development</a>     </li>     <li class="item-510"><a href="#">Executive Capability Review</a>     </li>     <li class="item-511"><a href="#">Board and Executive Coaching</a>     </li>     <li class="item-512"><a href="#">Cross Cultutral Coaching</a>     </li>     <li class="item-513"><a href="#">Team Enhancement &amp; Coaching</a>     </li>     <li class="item-514"><a href="#">Personnel Re-deployment</a>     </li> </ul> 

but even though bullets are displayed. (I'm not quite sure that those are ul's bullets, because when you hover the text the "bullets" get underlined.)

Image Demo: https://i.imgur.com/2wsnBqP.png

The third level from the menu

Answer 1

Have you tried setting

li {list-style-type: none;} 

According to Need an unordered list without any bullets, you need to add this style to the li elements.

Answer 2

You can remove the "bullets" by setting the "list-style-type: none;" Like

ul {     list-style-type: none; } 

OR

<ul class="menu custompozition4"  style="list-style-type: none;">     <li class="item-507"><a href=#">Strategic Recruitment Solutions</a>     </li>     <li class="item-508"><a href="#">Executive Recruitment</a>     </li>     <li class="item-509"><a href="#">Leadership Development</a>     </li>     <li class="item-510"><a href="#">Executive Capability Review</a>     </li>     <li class="item-511"><a href="#">Board and Executive Coaching</a>     </li>     <li class="item-512"><a href="#">Cross Cultutral Coaching</a>     </li>     <li class="item-513"><a href="#">Team Enhancement &amp; Coaching</a>     </li>     <li class="item-514"><a href="#">Personnel Re-deployment</a>     </li> </ul>