Hello,
after searching the forum i have made changes in module's css and the menu looks pretty much like i want. But i am facing some problems:
1. The menu is really messed up with IE6. The padding of menu-arrow doesn't work and also the template's headerbar_bg.png image has disappeard.
2. When i am visiting website's pages for the first time, the menu for some seconds keeps its native format without the styles,padding,colors etc that are configured.
What is causing this issue? Do i have to make the changes to the original .css files? url electricenergy .gr
thanks for this great module!
| Code: |
#menu1 .ux-menu-container
{
margin-top: 6px;
left: 150px;
}
#menu1 .ux-menu-container .ux-menu A
{
line-height: 78px;
color: #7F8384;
background: none;
border: 0px none;
}
#menu1 .ux-menu-container .ux-menu A:hover
{
color: #3990BD;
}
#menu1 .ux-menu-container .ux-menu .ux-menu-sub a
{
background: url("images/menu_level2_item.png") repeat scroll 0 0 #F3F4F5;
border: 1px solid #eee;
}
#menu1 .ux-menu-container .ux-menu .ux-menu-sub a:hover
{background:aliceblue;color:#3990BD;font-size:14px !important;}
#menu1 .ux-menu-container .ux-menu-sub LI A
{
line-height: 17px;
width: 155px;
left: 15px;
}
#menu1 .ux-menu LI.ux-menu-item-main
{
padding-right: 10px; /* space between main menu items */
}
#menu1 .ux-menu-sub li a {color:#6C6C6C;font-size:14px !important;text-align:left !important;border-right:1px solid #eee !important;border-left:1px solid #eee !important;padding:7px !important;}
#menu1 .ux-menu-sub li a:hover {background:#eee;color:#505050;font-size:14px !important;}
#menu1 .ux-menu-sub .ux-menu-link-last a {border-bottom:1px solid #C5C5C5 !important;}
#menu1 .ux-menu SPAN.ux-menu-arrow
{
margin-top: 30px;
right: 5px;
}
#menu1 .ux-menu .ux-menu-sub SPAN.ux-menu-arrow
{
margin-top: 0px;
right: 10px;
}
|
