Thanks Jack. That makes sense and something I should have realized.
Now, with the changes made to reflect the suggestion below, each list
item is extending across the entire width of the parent block in a
vertical order. By adding a "float: left" rule to the list item I can
get the effect I'm going for. Of course, then I have to deal with the
floating issues so I'm wondering if there is another way around using
a float to achieve the same effect.
Pertinent CSS
#mainnav ul {
margin: 1em auto;
padding: 0;
}
#mainnav li a:link, #mainnav li a:visited {
width: auto;
margin: 0 0.35em 0 0;
padding: 1em 0;
color: #FFF;
text-align: center;
display: block;
text-decoration: none;
background-color: #000;
}
#mainnav li {
margin: 0 0.5em 0 0;
padding: 0;/*
float: left;*/
display: inline;
}
On May 18, 2005, at 3:35 PM, jack fredricks wrote:
you can't give a width to an inline element like an <a>. Turn your
<a>s into block elements using
a {
display:block;
width:auto;
}
li {
width:88px
}
On 5/19/05, Mike Stickel <[EMAIL PROTECTED]> wrote:
I'm working on a new project and the horizontal navigation is a
pretty strict size - each item should be about 88px wide so that the
navigation fills the width of the page. I thought using a list would
work but I can't figure out how to specify the width for list items
and I'm hoping someone can shed some light on the subject for me.
Mike Stickel
Screenflicker Developments
www.screenflicker.com
p: 403-923-7667
e: [EMAIL PROTECTED]
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/