judyhicks
asked on
problem with margins on submenu
http://www.plushdesign.net/bbrox/?page_id=81
i can't get the submenu text of the current page item to line up with its parent text. if you are on a page that has a dropdown, the submenu items are shifted to the right 5px. the positioning on hover is fine, as is for the other submenus. i have tried changing every combination but then fix one spot only to have the positioning shift in another (either the submenu list items or the green background box). i am sure it is something obvious, although it seems that it should be something limited to the current-menu-item of the second level in order not to impact the rest of the nav.
*sigh* thank you.
ps: there is a rule at the end of the style sheet that was given to me by Builder tech support to try, which appeared to do nothing. it is— .builder-module-navigation li li a:hover {padding: 0 15px;}
/*** rule for current page item, first level ***/
.menu li.current-menu-item a,
.memu li.current_page_item a {
padding: 0px 10px;
margin: 0px 0px 0px 0px;
text-transform: uppercase;
font-weight: bold;
font-size: 1.1em;
line-height: 35px;
vertical-align: middle;
text-decoration: none;
height: 35px;
color: #fff; !important;
background-image: url(images2/nav_lite.png);
background-repeat: repeat-x;
background-position: left top;
}
/******************* second level stuff *****************/
.builder-module-navigation li ul { /*dropdown list (block)*/
width: 15em;
text-align: left;
margin: 0px 0px 5px 0px;
background: transparent;
border-left: 1px solid #C2D8D8;
border-right: 1px solid #C2D8D8;
}
.builder-module-navigation li li { /*dropdown items (words)*/
width: 15em;
background-image: none;
background-color: #CAECA2 !important;
margin: 0 0px 0 0px;
padding: 0;
color: #666 !important;;
font-weight: normal !important;
}
/*** rule for current page item, second level ***/
.builder-module-navigation li li a,
.builder-module-navigation li li.current_page_item a,
.builder-module-navigation li li.current-cat a { /*current page item*/
background: #transparent;
color: #666 !important;
margin: 0 0px 0 0px;
border: none;
border-bottom: 1px solid #C2D8D8;
font-weight: normal !important;
background-image: none !important;
}
.builder-module-navigation li li a:hover {
background-color: #E5F9CB !important;
color: #ccc !important;
margin: 0;
padding: 0 0px 0 10px;
font-weight: normal !important;
display: block;
i can't get the submenu text of the current page item to line up with its parent text. if you are on a page that has a dropdown, the submenu items are shifted to the right 5px. the positioning on hover is fine, as is for the other submenus. i have tried changing every combination but then fix one spot only to have the positioning shift in another (either the submenu list items or the green background box). i am sure it is something obvious, although it seems that it should be something limited to the current-menu-item of the second level in order not to impact the rest of the nav.
*sigh* thank you.
ps: there is a rule at the end of the style sheet that was given to me by Builder tech support to try, which appeared to do nothing. it is— .builder-module-navigation
/*** rule for current page item, first level ***/
.menu li.current-menu-item a,
.memu li.current_page_item a {
padding: 0px 10px;
margin: 0px 0px 0px 0px;
text-transform: uppercase;
font-weight: bold;
font-size: 1.1em;
line-height: 35px;
vertical-align: middle;
text-decoration: none;
height: 35px;
color: #fff; !important;
background-image: url(images2/nav_lite.png);
background-repeat: repeat-x;
background-position: left top;
}
/******************* second level stuff *****************/
.builder-module-navigation
width: 15em;
text-align: left;
margin: 0px 0px 5px 0px;
background: transparent;
border-left: 1px solid #C2D8D8;
border-right: 1px solid #C2D8D8;
}
.builder-module-navigation
width: 15em;
background-image: none;
background-color: #CAECA2 !important;
margin: 0 0px 0 0px;
padding: 0;
color: #666 !important;;
font-weight: normal !important;
}
/*** rule for current page item, second level ***/
.builder-module-navigation
.builder-module-navigation
.builder-module-navigation
background: #transparent;
color: #666 !important;
margin: 0 0px 0 0px;
border: none;
border-bottom: 1px solid #C2D8D8;
font-weight: normal !important;
background-image: none !important;
}
.builder-module-navigation
background-color: #E5F9CB !important;
color: #ccc !important;
margin: 0;
padding: 0 0px 0 10px;
font-weight: normal !important;
display: block;
In .menu li.current-menu-item a, .memu li.current_page_item a (line 312 in style.css remove the padding-left 10px.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
thank you!