Created a horizontal menu using css and html but now all other
elements on my page will float to left because of this. How can I fix it? nav ul, li { margin: 0; padding: 0; list-style: none; float: left; }

Question

Created a horizontal menu using css and html but now all other <ul> elements on my page will float to left because of this. How can I fix it? 


nav ul, li {
     margin: 0;
     padding: 0;
     list-style: none;
     float: left;
   
}

anonymous · Answer

Because you haven't specified the dependency that li has on ul and nav. So basically your CSS has it where you are saying.

"For all unordered lists who's parent is a nav tag and for all list items"

That is probably why all your ul elements are acting funny

anonymous · Answer

Try it out

anonymous · Answer

nav li{
     position: relative;
}

nav ul {
    
     height: 2em;
     width: 100%;
}

nav li a{
     display: block;
     line-height: 3em;
     padding: 0 1em;
     color: #e7e5e5;
     
    font-weight: bold;
	
	text-shadow: 0 1px 1px rgba(0,0,0, .3);
}