inline lists - can each list item be the same width?

Halcrow · Sep 10, 2004

I'm trying to set up a menu bar, using an inline list containing each link. I've noticed that each list item defines its width depending on the amount of text. I would like to have each link set to the same width, but cannot get this to happen - the "width: x" command has no effect.

What can I do to set each <li> to the same width?

FesterSXS · Sep 10, 2004

try including display: block; in the style definition for the list item, as well as the width attribute.

Tony
________________________________________________________________________________

http://www.SpiraxSarco.com

vego · Sep 10, 2004

try this...

Code:

<head>
<style type="text/css">
<!--

ul {
margin: 0;
width: 306px;
background-color: #000000;
}

li {
margin: 1px;
padding: 5px;
width: 100px;
display: inline;
text-align: center;
background-color: #ff0000;
}

-->
</style>
</head>
<body>
<ul>
<li><a href="#">THIS</a></li>
<li><a href="#">THAT</a></li>
<li><a href="#">OTHER</a></li>
</ul>
</body>

Ecreations · Sep 22, 2004

try this link

http://www.alistapart.com/articles/taminglists/

The solution is simple, the problem is complex.

http://www.ecreationscanada.com

Halcrow · Sep 23, 2004

thanks for your suggestion - I got it to work!

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

inline lists - can each list item be the same width?

Halcrow

Programmer

FesterSXS

Programmer

vego

Programmer

Ecreations

Programmer

Halcrow

Programmer

Similar threads

Part and Inventory Search

Sponsor