Bullets not showing in Firefox

[ngreenwood6]

I have the following code:

 

ul.menu {
  list-style: none;
  border: none;
  text-align:left; /* LTR */
}
ul.menu li {

  margin: 0 0 0 0.5em; /* LTR */
}
li.expanded {
  list-style-type: circle;
  list-style-image: url(../../misc/menu-expanded.png);
  padding: 0.2em 0.5em 0 0; /* LTR */
  margin: 0;
}
li.collapsed {
  list-style-type: disc;
  list-style-image: url(../../misc/menu-collapsed.png); /* LTR */
  padding: 0.2em 0.5em 0 0; /* LTR */
  margin: 0;
}
li.leaf {
  list-style-type: square;
  list-style-image: url(../../misc/menu-leaf.png);
  padding: 0.2em 0.5em 0 0; /* LTR */
  margin: 0;
}
li a.active {
  color: #000;
}
td.menu-disabled {
  background: #ccc;
}
ul.links {
  margin: 0;
  padding: 0;
}
ul.links.inline {
  display: inline;
}
ul.links li {
  display: inline;
  list-style-type: none;
  padding: 0 0.5em;
}
.block ul {
  margin: 0;
  padding: 0 0 0.25em 1em; /* LTR */
}

 

In internet explorer the bullets are showing up fine but for some reason in firefox they are not. I have searched the internet but havent come up with anything that actually fixes the issue. ANy help is appreciated.

[haku]

You need to set either

 

list-style-position:inside;

 

or

 

list-style-position:outside;

 

Firefox does it one way, IE the other. You need to explicitly set it so they are both the same. Can't remember which off the top of my head though.

[ngreenwood6]

Where do I need to set that? In each of those or just one? Thanks for the help.

[haku]

Set it for all li elements.

[ngreenwood6]

Ok I just changed my code to this:

 

/* $Id: system-menus.css,v 1.1 2007/10/05 14:50:25 goba Exp $ */

ul.menu {
  list-style: none;
  border: none;
  text-align:left; /* LTR */
}
ul.menu li {
list-style-position:inside;
  margin: 0 0 0 0.5em; /* LTR */
}
li.expanded {
list-style-position:inside;
  list-style-type: circle;
  list-style-image: url(../../misc/menu-expanded.png);
  padding: 0.2em 0.5em 0 0; /* LTR */
  margin: 0;
}
li.collapsed {
list-style-position:inside;
  list-style-type: disc;
  list-style-image: url(../../misc/menu-collapsed.png); /* LTR */
  padding: 0.2em 0.5em 0 0; /* LTR */
  margin: 0;
}
li.leaf {
list-style-position:inside;
  list-style-type: square;
  list-style-image: url(../../misc/menu-leaf.png);
  padding: 0.2em 0.5em 0 0; /* LTR */
  margin: 0;
}
li a.active {
list-style-position:inside;
  color: #000;
}
td.menu-disabled {
  background: #ccc;
}
ul.links {
  margin: 0;
  padding: 0;
}
ul.links.inline {
  display: inline;
}
ul.links li {
list-style-position:inside;
  display: inline;
  list-style-type: none;
  padding: 0 0.5em;
}
.block ul {
  margin: 0;
  padding: 0 0 0.25em 1em; /* LTR */
}

 

It is still not working. I also tried setting it to outside instead of inside and that didnt work either.Can you give me any other suggestions? I know I am working with the right file too because when I changed it to inside it moved them closer to the text.

[ngreenwood6]

I really need some help with this. I have been working on this for 3 days now and have at least 6 hours into this. Any suggestions are welcome.