width of sub-menus is 20.
My custom CSS:
Code:
ul.rMenu {
padding: 0 !important;
margin: 0 !important;
list-style: none !important;
border: 0 !important;
background-color: #5c5a5a !important;
}
ul.rMenu li {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
ul.rMenu li a {
margin: 0 !important;
padding: 0 !important;
border: solid 0px #5c5a5a;
background-image: URL(http://www.trentstudios.com/images/orangetab.png) !important;
background-repeat: no-repeat;
background-color: #5c5a5a !important;
width: 123px !important;
height: 35px !important;
}
div#menu1 ul.rMenu li:hover > a,
background-color: #5c5a5a !important;
ul.rMenu li a: hover {
border: solid 0px #5c5a5a;
background-image: URL(http://www.trentstudios.com/images/orangetab.png) !important;
background-repeat: no-repeat;
width: 123px !important;
height: 35px !important;
}
ul.rMenu li.current_page_item a {
background-color: #5c5a5a !important;
color: #FFF !important;
background-image: URL(http://www.trentstudios.com/images/orangetab.png) !important;
background-repeat: no-repeat;
width: 123px !important;
height: 35px !important;
}
#menu1 {
background-color: #5c5a5a !important;
margin: 0px;
border: solid 0px #5c5a5a !important;
}
ul.rMenu-ver {
padding: 0 !important;
margin: 0 !important;
list-style: none !important;
border: 0 !important;
}
ul.rMenu-ver li {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
ul.rMenu-ver li a {
margin: 0 !important;
padding: 0 !important;
color: #FFF !important;
border: solid 0px #5c5a5a;
background-image: URL(http://www.trentstudios.com/images/dark-grey-sub-menu-background.gif) !important;
background-color: #5c5a5a !important;
}
li.rMenu-expand li {
width: 123px !important;
height: 35px !important;
margin: 0 !important;
padding: 0px !important;
}
.rMenu-expand page_item li {
width: 123px !important;
height: 35px !important;
margin: 0 !important;
padding: 0px !important;
}