I have a horizontal <ul>
menu. How can I fix the width of the <li>
elements at, say, 250px each?
To create space between list bullets and text in HTML, use CSS padding property. Left padding padding-left is to be added to <ul> tag list item i.e. <li> tag. Through this, padding gets added, which will create space between list bullets and text in HTML.
When you need to create a list that expands horizontally, you need to add the display:inline style to the <li> elements of the list. A horizontal list is commonly used for creating a website's navigation menu component.
Styling the A tag can help maintain consistency and give you a little more flexibility than styling the LI tag, espeically if you end up making multi-line menu items.
ul li {
float:left;
}
ul li a {
display:block;
width:250px;
}
You should also use a CSS reset to maintain consistency between browsers.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With