You are not logged in.
brilliantly done product! I'm integrating my first one for a client now.
However, I need more room side-to-side for the <iframe> on their web pages. So, I want to move the menu from its current left hand vertical orientation, to a top, horizontal orientation.
---In #ha #menu - I have commented out FLOAT: left
---and I've set MARGIN: 0 5 0 0
QUESTION:
How can I get the menu to change from vertical to horizontal?
Regards,
Glenn Whitten
Offline
OK, menu is now horizontal using the CSS listed below.
However, it is still displaying on 2 rows. Where do I go to remove the <br> or whatever is forcing the second row?
#ha #menu {
BORDER: #DDDDDD 0px solid;
BACKGROUND-COLOR: #FFFFFF;
}
#ha #menu ul
{
margin: 0;
padding: 5;
list-style-type: none;
text-align: left;
}
#ha #menu ul li { display: inline; }
#ha #menu ul li a
{
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #036;
}
#ha #menu ul li a:hover
{
color: #fff;
background-color: #369;
}Thanks for any suggestions ,
--Glenn
Offline
OK, so after I logged in and the menu choices tripled things didn't look so good. The vertical spacing of the horizontal menu choices didn't work.
After a little digging at my favorite CSS List authority --Listutorial at MaxDesign.com --indicates that I need to CHANGE the display parameter from inline to block.
#ha #menu ul li
{
display: block;
float: left;
width: 14em;
}That's great...now I can set the width and add padding as necessary to the menus.
However, it raises another issue (doesn't it always?)...
Now the menu is overlaying some of the other elements. I am going to go thru and try to set the FLOAT = left to try to get them to stack up correctly.
float: left;
Regards,
Glenn
Last edited by tensegrity (2007-08-07 17:04:49)
Offline