CodeAve.com CodeAve.com - CSS - Text Display
ASP
JavaScript
CSS
·Basics
·Page Display
·Text Display
·Script Writers
·Contents
·What's New?
HTML
Maps
Links
Mail List
Search
Sitemap


 


List Style Position
Lists in CSS can be dressed up in a number of ways. On way is to make lists where the list item markers are inside or outside the header text. Most browsers by default will list the item markers outside the range of the list and make all the text line up. Conversely, the inside tag will place the item markers directly under the first letter of the header text. The following example will demonstrate both the inside and outside list style position properties.
View the Output
Text View
Print View
Mail this Link
Download the Code

<html>
<head>
<title>CodeAve.com/CSS - List Style Position</title>
</head>
<body bgcolor="#FFFFFF">

<ul style="list-style-position: inside">
<b>Inside</b>
<li>Item One</li>
<li>Item Two</li>
<li>Item Three</li>
<li>Item Four</li>
<li>Item Five</li>
</ul>

<ul style="list-style-position: outside">
<b>Outside</b>
<li>Item One</li>
<li>Item Two</li>
<li>Item Three</li>
<li>Item Four</li>
<li>Item Five</li>
</ul>

</body>
</html>

 

 

 



ASP: What's New? | Articles | Script Writers | Database Display | Read/Write
Server Variables | Response Objects | Random Events | Miscellaneous
HTML: Forms | Hyperlinks | Headers | Tables | Hyperlinks | Headers | Text Display
JavaScript: Document Info | Forms | Images | Navigation | Script Writers
CSS: Basics | Page Display | Text Display | Script Writers | Miscellaneous
Maps: Map Script Writers | Bing Maps | Google Maps
Privacy Statement

CodeAve.com is hosted by MyHosting.com
Donate Food Online with a Mouse Click at TheHungerSite.com
Donate Land Online with a Mouse Click at TheRainForestSite.com
© 1999 - 2010 CodeAve.com
All Rights Reserved