Re: [css-d] fixed width horizontal list

[Jay Tanna]

First change your code to this:

<div id="centeredmenu">

  <ul>
    <li><a href="/">Home</a></li>

    <li><a href="consulting">Consulting</a></li>

    <li><a href="ica-atom">ICA-AtoM</a></li>

    <li><a href="clients">Clients</a></li>

    <li><a href="about">About</a></li>

    <li><a href="contact">Contact</a></li>
  </ul>
<div>

Then change your css to this:

#centeredmenu {
   float:left;
   width:100%;
   background:#fff;
   border-bottom:4px solid #000;
   overflow:hidden;
   position:relative;
}
#centeredmenu ul {
   clear:left;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   left:50%;
   text-align:center;
}
#centeredmenu ul li {
   display:block;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   right:50%;
}
#centeredmenu ul li a {
   display:block;
   margin:0 0 0 1px;
   padding:3px 10px;
   background:#ddd;
   color:#000;
   text-decoration:none;
   line-height:1.3em;
}
#centeredmenu ul li a:hover {
   background:#369;
   color:#fff;
}
#centeredmenu ul li a.active,
#centeredmenu ul li a.active:hover {
   color:#fff;
   background:#000;
   font-weight:bold;
}

It should now work.



--- On Tue, 11/17/09, Jack Bates <ms...@freezone.co.uk> wrote:

> I want to style an <ol> so it
> looks similar to the main links on this
> page, http://artefactual.com/
> 
> - horizontal
> - right justified
> - fixed width
> 



      
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/