html - Horizontal nav bar centers, but links are vertical? -


so issue css centers nav bar fine, links listed vertically in horizontally centered bar.

it ends looking
http://i.imgur.com/rqcxwk4.png
need links horizontal.

<nav id="nav">     <ul>         <li><a href="#about">about</a></li>         <li><a href="#baa">description</a></li>     </ul> </nav> 

and css

} nav ul { display:inline; } .nav li{     display:inline; } .nav a{     float:left;   display:inline-block;       padding:10px; } nav a:link, a:visited {     display: block;     width: 100%;     font-family: refrigerator;     font-weight: bold;     font-size: 1.5em;     color: #ffffff;     background-color: #778899;     text-align: center;     padding: 4px; }  nav a:hover, a:active {     background-color: #ff3333;     color: black; } 

        #nav ul {              display:inline;          }          #nav li{              display:inline-block;          }          #nav a{              float:left;              display:inline-block;              padding:10px;          }          nav a:link, a:visited {              display: block;              width: 100%;              font-family: refrigerator;              font-weight: bold;              font-size: 1.5em;              color: #ffffff;              background-color: #778899;              text-align: center;              padding: 4px;          }            nav a:hover, a:active {              background-color: #ff3333;              color: black;          }
    <nav id="nav">          <ul>              <li><a href="#about">about</a></li>              <li><a href="#baa">description</a></li>          </ul>      </nav>

hope, help.


Comments

Popular posts from this blog

html - Outlook 2010 Anchor (url/address/link) -

javascript - Why does running this loop 9 times take 100x longer than running it 8 times? -

Getting gateway time-out Rails app with Nginx + Puma running on Digital Ocean -