Issue with Removing Bullets on UL LI

Question

<div class="menu-editor-menu-container">
<ul id="menu-editor-menu" class="menu">
<li id="menu-item-292" class="AdminMenu menu-item menu-item-type-custom menu-item-object-custom menu-item-292">
<a>Welcome,  John Doe</a>
</li>
</ul>
</div>

In this instance I want to remove the bullet points that appear before the <li>, but not everywhere else in the site, for the life of me I cannot get them to go away using CSS. Ideas?

Does this answer your question? [I need an unordered list without any bullets](https://stackoverflow.com/questions/1027354/i-need-an-unordered-list-without-any-bullets) — qxlab, Feb 11 '20 at 17:56

score 1 · Answer 1 · answered Feb 11 '20 at 18:09

1

You need list-style: none.

To target just this list use a selector that is specific enough, for example, just this menu:

#menu-editor-menu {
  list-style: none;
}

Or even just this one list item:

#menu-item-292 {
  list-style: none;
}

answered Feb 11 '20 at 18:09

BugsArePeopleToo

2,976
1
15
16

score 0 · Answer 2 · answered Feb 11 '20 at 18:12

So Simple, Hope it helps. Thanks.

.menu-editor-menu-container ul{
  list-style: none;
  /*Optional*/
  padding-left: 0px;
}

<div class="menu-editor-menu-container">
  <ul id="menu-editor-menu" class="menu">
    <li id="menu-item-292" class="AdminMenu menu-item menu-item-type-custom menu-item-object-custom menu-item-292">
      <a>Welcome,  John Doe</a>
    </li>
  </ul>
</div>

Issue with Removing Bullets on UL LI

2 Answers2