List Type Style

Question

Hi there,

a very confusing thing I'm facing here.

Css

ul {
    list-style: none;
    padding: 1em 0;
    margin: 0;
}
li {
    padding: 1em;
    display: inline;
}
li a {
    text-decoration: none;
}
.normalized-list{
    list-style-type: disc;
    list-style-image: none;
    list-style-position: inside;
    padding: 1em 1em;

}
.normalized-list li{
    display: block;
    padding: 0.5em;
}

HTML

<ul class="normalized-list">
<li>...</li>
</ul>

Sadly no bullets are shown up on the li elements. Actually I don't know why.

Answer 1

maybe because you display it inside and not outside the element. so that it is not visible.

.normalized-list{
list-style-type: disc;
list-style-image: none;
list-style-position: outside;
}

have you tested it in multiple browsers? please try firefox with the firebug extension to see if the inheritance works as it should

Answer 2

Hmm, some browsers are quite funny when it comes to this What I would try is the following

ul
{
  /*set your normal unordered list stuff*/
}

ul#specializedlist
{
  /*set your specialized list stuff*/
}

Answer 3

But it is working on IE8. Firefox 3.6 is not showing the bullets. What is your expectation?

Answer 4

display: list-item;

not block.