WebsiteBaker Support (2.8.x) > Templates, Menus & Design

Showmenu2 - CSS/Styling

<< < (2/2)

foonji:

I sort of got it working, but a few little bugs;

1. Not positioned in the center of the page
2. Seems first link is left out? maybe because of positioning
3. Submenu links are on top of each other.

Can anyone help me out with these?

The New CSS developed from http://css.maxdesign.com.au/listamatic2/horizontal05.htm#


--- Code: ---.menu-0 {
position: relative;
margin: 0;
padding: 0;
line-height:20px;
}

.menu-1 {
line-height:20px;
}

.menu-0 li {
float: left;
margin: 0 0 0 2px;
list-style-type: none;
display: inline;

}

.menu-0 li a {
position: relative;
width: auto;
display: block;
text-align: left;
text-decoration: none;
padding: 2px 4px 2px 4px;
margin: 0px;
color: #dd6900;
}

.menu-0 li a:hover {
color: #FF9900;
padding: 2px 4px 2px 4px;
margin: 0px;
text-decoration: none;
}

.menu-0 li .menu-current a {
background: #2d2d2d;
}

.menu-0 li .menu-current a:hover {

}

.menu-0 ul .menu-1 {
position: absolute;
width: 100%;
left: 0;
margin: 0;
padding: 0;
white-space: nowrap;
}

.menu-0 ul .menu-1 li {
width: 14ex;
margin: 0;
border: 0;
}

.menu-0 ul li .menu-1 ul li a {
width: auto;
border: 0;
padding: 2px 4px 2px 4px;
margin: 0px;
color: #dd6900;

}

.menu-0 ul li .menu-1 ul li a:hover {
color: #FF9900;
padding: 2px 4px 2px 4px;
margin: 0px;
text-decoration: none;
}

.menu-0 ul li .menu-1 ul li a:active {
color: #000000;
text-decoration: none;
}

.menu-0 ul .menu-1 li .menu-current a {


}

.menu-child a {
background:none;
}
--- End code ---

Argos:
You can also use 2 menu's: the main with showmenu2, and the second by using a childpages droplet and floating the links left in a centered container.

Navigation

[0] Message Index

[*] Previous page