Posted by vunet.us on 01/31/07 18:55

On Jan 31, 1:22 pm, "Jonathan N. Little" <lws4...@centralva.net>
wrote:
> vunet...@gmail.com wrote:
> > Thank you very much. How can I modify this example of yours to make UL
> > LI horizontal? I saw this could be done, but how. And if I need
> > horizontal, then am I better off with UL LI?
> > I really appreciate your advise and time.
>
> More than one way, but if you remove the width on the UL, tweak padding,
> and remove block proprieties added to A elements and make LI inline...
>
> BODY { color: #000; background-color: #cfa; }
> UL.menu{
> margin: 0; padding: .5em; border: 3px outset #050;
> list-style: none; background-color: #050;
> font-family: arial, helvetica, sans-serif;}
>
> UL.menu LI { margin: 0 .5em 0 0; padding: 0; display: inline; }
> UL.menu LI A { padding: .25em; border: 2px solid #050;
> font-weight: bold;
> text-decoration: none; color: #ff0; }
> UL.menu LI A:hover {
> color: #fff; border: 2px inset #050;
>
> }
>
> This makes a horizontal bar with same hover "effects" as the vertical...
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com

Thank you Jonathan. Solution and tip are both considered.

[Back to original message]