I'm looking to increase the spacing between each menu item as they appear too close together. Can someone help me with managing this? The menu names are currently right under one another, almost touching. What is the best way to create more space between them?
Here's the CSS I have:
#navside ul
{
margin: 2;
padding: 0;
list-style-type: none;
}
#navside ul li { display: block; }
#navside ul li a
{
text-decoration: none;
padding: 1em 1em;
color: #bfaeae;
}
#navside ul li a:hover
{
text-decoration: underline;
color: #f0f0f0;
}
And here is my menu:
<div id="navside">
<ul>
<li><a href="#">menu one</a></li>
<li><a href="#">Menu one</a></li>
</ul>
</div>