Click to See Complete Forum and Search --> : Horizontal Lists
Kurisu
10-14-2006, 07:16 AM
Hello, I'm new to CSS and although was off to a rocky start I seem to be on track now. Although I'm trying to create a horizontal list of items and all I have found was to use the display: inline; property, however, this is really not producing the output I had hoped. The problem is all the markers are gone in front of the list items... err how do I bring 'em back? list-style-type: square; ain't workin.
Ex:
#menu
{
background: #98bfef;
height: 36px;
}
#menu ul
{
text-align: center;
margin-top: 3px;
padding-top: 7px;
font-size: 18px;
color: #ffffff;
font-weight: normal;
font-family: times, serif;
}
#menu ul li
{
display: inline;
padding-right: 40px;
}
Kravvitz
10-14-2006, 03:04 PM
When you give them display:inline; they lose their markers. You could float them instead, but they'd still lose their markers in IE. You could use a non-repeating background image instead.
WebJoel
10-14-2006, 04:38 PM
When you give them display:inline; they lose their markers. You could float them instead, but they'd still lose their markers in IE. You could use a non-repeating background image instead.
There is something about IE and 'losing the bullets' when declared "inline" I just read recently. -I think the article said that by adding a margin-left:n you gain back the lost real-estate and the bullets will be shown (or image URL in lieu of bullet, if that is what you wanted), -does this sound familar to anyone?
I think also that "display:inline;" and declaring that the 'list-style-type:inside;" have some bearing on this as well...
Kravvitz
10-14-2006, 04:42 PM
I've tried that. It doesn't work in IE6 or IE7.
WebJoel
10-14-2006, 04:49 PM
I've tried that. It doesn't work in IE6 or IE7.
-I'll try to find the article, -but I'm not surprised (that it doesn't work... we're talking about IE here so my hopes weren't too high). sigh...
edit:
I wrote "list-style-type:inside;", -that is not correct. Has anyone tried "list-style-position:inside;" ? If this is what I think I had read, it will place the 'disc' inside the list-item and not outside of it, as IE defaults to (incorrectly I might add)...
edited:
okay... now I'm getting mad. :( Somewhere I read an article that addressed this (untested by me, -and apparently un-bookmarked by me either!) :(
WebJoel
10-14-2006, 06:26 PM
Ah here we go. Maybe not quite what we need, but an interesting article...
http://www.communitymx.com/content/article.cfm?page=1&cid=01DB3