Forums

CSS menu error

Permalink
http://123.100.89.170/~kent4may/concrete5.6.1.2/

I have replaced the auto nav styling with my own css.
However, I have 2 issues:
1. Each menu item should be equal width of 180px
2. A hover should show the description of the menu item (like a tooltip) but behaves likes a sub-menu item.

any thoughts please?
trixiemay
 
FischerVision replied on at Permalink Best Answer Reply
FischerVision
At first, you should make the with on the a class, not the li itself.
In your style.css at line 87
#navHor li a {
width 180px;
}


Then you could align your top menu with your left menu and make it more equal.
So you could make it like this
#navHor {float: left; margin-left:-20px;position:relative;width:100%;}
#navHor li{border-radius:10px;display:inline;z-index:500;}
#navHor li a {
background: none repeat scroll 0 0 #055789;
    border: 3px outset #CCCCCC;
    border-radius: 10px 10px 10px 10px;
    color: #FFFFFF;
    display: inline-block;
    font-family: "Fjalla One",Impact,san-serif;
    font-size: 18px;
    height: 30px;
    padding: 8px 5px;
    text-align: center;
    text-decoration: none;
    width: 170px;
Viewing 15 lines of 16 lines. View entire code block.

Width 170px because you have 5px padding on the left and right.

For the second issue, where do you place the discription?