html lists - Trying to make a footer sitemap with css (the footer is made out of ul li) -


i want similar this:

http://i.stack.imgur.com/eo1dz.gif

i've been trying out few different things nothing seems make neat horizontal list picture. can me out?

  <!-- footer informatie -->     <footer>         <section id="sitemap">             <h2>sitemap</h2>             <ul>                 <li>                     <a href="#">opleiding</a>                     <ul>                         <li><a href="#">visie &amp; beleid</a></li>                         <li><a href="#">opbouw studieprogramma</a></li>                         <li><a href="#">competenties</a></li>                         <li><a href="#">diploma</a></li>                         <li><a href="#">beroepen</a></li>                     </ul>                 </li>                 <li>                     <a href="#">onderwijsprogramma</a>                     <ul>                         <li><a href="#">mededelingen</a></li>                         <li><a href="#">uitagenda</a></li>                         <li><a href="#">propedeuse</a></li>                         <li><a href="#">verdieping 1</a></li>                         <li><a href="#">verdieping 2</a></li>                         <li><a href="#">afstuderen</a></li>                     </ul>                 </li>                 <li>                     <a href="#">organisatie</a>                     <ul>                         <li><a href="#">contact</a></li>                         <li><a href="#">blog</a></li>                         <li><a href="#">docenten</a></li>                         <li><a href="#">onderwijsbureau</a></li>                         <li><a href="#">stagebureau</a></li>                         <li><a href="#">buitenlandbureau</a></li>                         <li><a href="#">examencommissie</a></li>                         <li><a href="#">decaan</a></li>                     </ul>                 </li>                 <li>                     <a href="#">stages en projecten</a>                     <ul>                         <li><a href="#">stages</a></li>                         <li><a href="#">projecten</a></li>                     </ul>                 </li>             </ul>         </section> 

and css far:

#sitemap li { list-style-type:none;  display: inline-block; border: 2px solid; } 

the inline block should make horizonal doesnt... doing wrong?

x

by using #sitemap li target every li inside #sitemap element, while in fact want target containing li's.

you might want use instead:

#sitemap > ul > li {     display: inline-block;     list-style-type:none;     border: 2px solid; } 

Comments

Popular posts from this blog

1111. appearing after print sequence - php -

java - WARN : org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/board/] in DispatcherServlet with name 'appServlet' -

Ruby on Rails, ActiveRecord, Postgres, UTF-8 and ASCII-8BIT encodings -