3

How to remove dot from "add recipe"? when i try it does not work...

html:

<div id=menu>
      <ul>
        <li><a href="add_recipe">Add recipe</a></li>
      </ul>
</div>

css:

#menu
ul > li
{
    list-style-type: none;
}
  • Read this: https://www.w3schools.com/css/css_list.asp – jeastogg Dec 28 '19 at 19:56
  • ul parent, li child... i just sow it somewhere. I tried only ul li but it does not work as well... –  Dec 28 '19 at 19:56
  • i does not help still does not work when put ul li ... –  Dec 28 '19 at 20:00
  • Is this answer to your question? [html - I need an unordered list without any bullets](https://stackoverflow.com/q/1027354/4061713) – Earid Dec 28 '19 at 20:05
  • no i have made it like this it does not help. I have to remove it form li so i have #menu ul li, but it does not work.. –  Dec 28 '19 at 20:14

3 Answers3

10

If you're referring to the "bullet point" marker, then it did work when I ran the code without changing anything. Are you sure it isn't working when you run it? Have you tried clearing the cache to make sure the old script isn't running?

HTML:

<body>
<div id=menu>
      <ul>
        <li><a href="add_recipe">Add recipe</a></li>
      </ul>
</div>
</body>

CSS:

ul li
{
    list-style-type: none;
}
Amit Sharma
  • 690
  • 8
  • 22
1

but your code as written works fine in chrome

ul 
{
    list-style-type: none;
}
<div id=menu>
      <ul>
        <li><a href="add_recipe">Add recipe</a></li>
      </ul>
</div>
DCR
  • 14,737
  • 12
  • 52
  • 115
  • sorry i see something wrong with chrome and it does work for explorer f.e. i think probably chrome will get it later.. –  Dec 28 '19 at 20:27
  • what do you see that's wrong? – DCR Dec 28 '19 at 20:29
  • in chrome it doesn not work yet, but i thinl it will be later –  Dec 28 '19 at 20:38
  • i run it on chrome now it works fine. There's some thing else in your code that's not working. check console log for errors – DCR Dec 28 '19 at 20:55
  • it works in explorer but not in chrome. i do not know what this console is –  Dec 28 '19 at 21:22
  • in chrome go to your web page and right click on it. Select inspect. a new window will open. Click on the console tab and see what it says. report back – DCR Dec 29 '19 at 17:32
0

Your code should work. Check for overrides if it doesn't work (you can use computed styles on the dev tools)

list-style-type can be added to the parent element (<ul> in this case) as child elements (<li>) inherit properties unless they're defined.

#menu ul {
    list-style-type: none;
}
<div id=menu>
  <ul>
    <li><a href="add_recipe">Add recipe</a></li>
  </ul>
</div>

More reference: https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type

Darshana Gunawardana
  • 86
  • 1
  • 3