Horizontal ordered list

**Maujor** · Mar 8, 2006, 15:36

Are there a way to display via CSS a horizontal ordered list without miss the order numbers?
HTML:

Code:

<ol>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
</ol>

Display:
1. Link 2. Link 3. Link 4. Link

CSS rules: ?????

**ghettopixel** · Mar 8, 2006, 15:59

Here is a basic example for you to expand upon, hope this helps you mate, enjoy

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
#nav ol 
	{
	padding:0px;
	margin:0px;
	list-style-position:inside;
	}
#nav ol li 
	{
	padding: 0px 30px 0px 0px;
	margin:0px;
	float:left;
	}
#nav ol li a:link , #nav ul li a:active, #nav ul li a:visited 
	{
	padding: 0 0 13px 0;
	color: [PUT HEX OR RGB COLOR HERE (# or rgb() stuff) OR IT WILL BE BLUE];
	text-decoration: none;	
	cursor: pointer;
	}
</style>
</head>

<body>
	<div id="nav">
		<ol>
			<li><a href="#">Link</a></li>
			<li>Link</li>
			<li>Link</li>
			<li>Link</li>
		</ol>
	</div>
</body>
</html>

**Maujor** · Mar 8, 2006, 16:30

Thanks Ghettopixel.
Works in FFox (and in compliants browsers I believe)
Fail in IE. Now I need a fix for our "kindness" Internet Explorer.

**Kravvitz** · Mar 8, 2006, 16:53

IE/Win does not render list markers on floated <li> elements or on <li> elements that have their display property set to "inline".

I suppose you could absolutely position them if you really wanted to.
http://www.stopdesign.com/articles/absolute/
http://www.autisticcuckoo.net/archiv...ively-absolute

Don't use XHTML 1.1.
XHTML 1.0 vs XHTML 1.1
Sending XHTML as text/html Considered Harmful
Serving up XHTML with the correct MIME type
http://www.w3.org/2003/01/xhtml-mimetype/
http://www.xml.com/pub/a/2003/03/19/dive-into-xml.html
http://www.w3.org/TR/xhtml-media-types/#summary
Content-Typing XHTML

The SitePoint Forums have moved.

User Tag List

Thread: Horizontal ordered list

Thread Tools

Display

Horizontal ordered list

Bookmarks

Bookmarks

Posting Permissions