CSS List of Same Sizes Elements for Horizontal Navigation

Question

Trying to learn some CSS, and I want a horizontal navigation bar, and I use ul and li to create it. I would like all the “buttons” to have the same width, is this possible with just CSS?

thanks

Answer 1

Not quite sure what you mean by the same width. Did you just set it using pixels from the link? What are your limitations? Do you know the width of the list? or communication line width?

<style type="text/css"> .menu { margin:0px auto; padding:0px; list-style-type:none; } .menu li { margin:0px auto; padding:0px; float:left; } .menu li a { display:block; width:200px; } </style> <ul class="menu"> <li><a href="#section1">Section1</a></li> <li><a href="#section1">Section1</a></li> <li><a href="#section1">Section1</a></li> </ul> 

Answer 2

Yes,

 ul li { display: block; float: left; width: 100px; } ul { padding: 0px; list-style-type: none; } 

Something like that. (Not verified);