Q:

HTML list formatting

New to CSS.  I tried to create a cascaded bullets. Turned out the style for li, ul were overwritten by some css file, I had to manually add style="list-style-type: disc;" to get back the bullet.
However the following HTML code doesn't produce the nested bullets with identations.
    this is an example
    <ul>
        <li style="list-style-type: disc;"> this 1
            <ul>
                <li style="list-style-type: disc;"> this is 1.1</li>
                <li style="list-style-type: disc;"> this is 1.2</li>
            </ul>
        </li>

    </ul>

Here is what it looks on my browser 

Any idea how to make the nested list with indentation by applying the right styles on the ul and li elements?
Thanks in advance.

A:

Check this example, I have made it very close to your case:
http://jsfiddle.net/MUNP9/
The idea is that some CSS in the page is overriding default padding-left of the nested ul. You can override it again.
Like:
ul ul {
    padding-left: 40px;
}

Also, you don't need to apply inline styles, just use CSS classes.

