Member Avatar for NewOrder

i cant make my list float to the left. i want to create a horizontal navigation bar. i have everything set, but it wont float to the left. help, please

ul. nav {   margin: 0;   padding: 0;   list-style: none;   width: 72em;   background: #FAA819  repeat-x; } 

ul. nav li {   float: left; }  // why it wont work?

ul.nav {   margin: 0;   padding: 0;   list-style: none;   width: 72em;   overflow: hidden;   background: #FAA819 url(img/mainNavBg.gif) repeat-x; } 


ul.nav a {   display: block;   padding: 0 3em;   line-height: 2.1em;   text-decoration: none;   color: #fff; } 

ul.nav a {   display: block;   padding: 0 2em;   line-height: 2.1em;   background: url(img/divider.gif) repeat-y left top;   text-decoration: none;   color: #fff; } 


ul. nav .first a {   background-image: none; } 


ul.nav li:first-child a {   background: none; } 

ul.nav a:hover, ul.nav a:focus  {   color: #333; }

HTML

<ul class="nav">   <li><a href="home.htm">Home</a></li>   <li><a href="about.htm">About</a></li>   <li><a href="news.htm">News</a></li>   <li><a href="products.htm">Products</a></li>   <li><a href="services.htm">Services</a></li>   <li><a href="clients.htm">Clients</a></li>   <li><a href="case-studies.htm">Case Studies</a></li> </ul>
Edited by NewOrder because: n/a
  • 2 Contributors
  • 1 Reply
  • 146 Views
  • 12 Hours Discussion Span
  • Latest Post Latest Post by Agarsia
Member Avatar for Agarsia

remove the spaces here: "ul. nav" it has to be "ul.nav"

ul.nav {   margin: 0;   padding: 0;   list-style: none;   width: 72em;   background: #FAA819  repeat-x; }

ul.nav li {   float: left; }  // why it wont work?

ul.nav {   margin: 0;   padding: 0;   list-style: none;   width: 72em;   overflow: hidden;   background: #FAA819 url(img/mainNavBg.gif) repeat-x; }


ul.nav a {   display: block;   padding: 0 3em;   line-height: 2.1em;   text-decoration: none;   color: #fff; }

ul.nav a {   display: block;   padding: 0 2em;   line-height: 2.1em;   background: url(img/divider.gif) repeat-y left top;   text-decoration: none;   color: #fff; }


ul.nav .first a {   background-image: none; }


ul.nav li:first-child a {   background: none; }

ul.nav a:hover, ul.nav a:focus  {   color: #333; }
commented: Thank you +0
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.