To format the Nested List we need to add some code to Additional CSS:
------------------------------------------
ul ul li {
list-style-type: disc;
margin-left: -75px;
}
ul ul ul li {
list-style-type: circle;
margin-left: -115px;
}

Preview the page and the Nested List should now look like this:

Very often I find the bullet points size aren't really compatible with the text size, so I change them by changing the bullet point size and line height and adding the font size and line height to span in Additional CSS. Now the CSS code will look like this:
-------------------------------------
ul li, ul ul li, ul ul ul li{
font-family: helvetica, arial, verdana, sans-serif;
font-size: 24px;
line-height: 1.0;
color: #352ece;
margin-bottom: 10px;
}
ul li {
list-style-type: square;
margin-left: -32px;
}
span {
font-size: 18px;
line-height: 1.4;
color: #393939;
}
ul ul li {
list-style-type: disc;
margin-left: -68px;
}
ul ul ul li {
list-style-type: circle;
margin-left: -105px;
}
-----------------------------------
The Nested List should now look like this:

That about covers the basics of creating an Unordered List. Now let's create a Nested Ordered List. If you don't need a Nested Ordered List just use the first <ol> tag
:---------------------------------
<ol>
<li></li>
<li></li>
<li></li>
</ol>
---------------------------------



    Join the Discussion
    Write something…
    Top