PDStudios

CSS Lists are very helpful, but what if you want them horizontal? This is easily done with a few attributes. First you need to give your ul and li tags an id. Example:

<div id=”horizontal”>

<ul>

 <li>

 </li>

</ul>

</div>

You only need to wrap your list in a div tag.

Now to your stylesheet.

First make the following style name:

#horizontal ul, li {

}

This has let us apply one style to both our ul and li tags that are housed inside our div tag.

Now apply the following attribute if you would like no bullet point:

list-style-type:none;

Now to make it a horizontal list.

float:left;
margin:0px;
padding:0px;

That will display your list as horizontal.

Your List should now be horizontal.

NOTE: ol tags can be used instead of ul.