[SOLVED] Problem with drop-down menu
1 Attachment(s)
Hello,
I have a problem with drop-down menu, once I make the top menu image pressed (gray image) the Image goes as well to drop down menu. How can I disable this? So the top menu will stay clickable (gray image) and it will not pass to the drop down menu. My code: div#menu1 ul.rMenu li.page-item-2.current_page_item a { background-image: url(url)!important; padding-top: 85px; padding-left: 20px; background-position: 50% 0%; background-repeat: no-repeat; } I think it's because "!important", but once I delete the image disappears. I would appreciate your help. |
Css is cascading - what ever you do to an rlement will cascade to its children unless there is other more specific css that applies to them.
|
Juggledad, Thanks for your reply.
Yes there are many codes, here they are: div#menu1 ul.rMenu li.page-item-2.current_page_item a { background-image: url[/url] padding-top: 85px; padding-left: 20px; background-position: 50% 0%; background-repeat: no-repeat; } ul.rMenu { padding-right:285px !important; list-style:none !important; margin:0px 0px 0px 0px; } ul.rMenu li { margin:0px 0px 0px 0px !important; padding: 0px 0px 0px 0px !important; } ul.rMenu li a { margin-right: 0px !important; padding: 60px 0px 0px 0px !important; color:#ffffff !important; font:normal 1.2em Arial !important; text-decoration:none !important; } div#menu1 ul.rMenu li { background-color: transparent; } div#menu1 ul.rMenu { background-color: transparent; } div#menu1 ul.rMenu li:hover > a, ul.rMenu li a:hover { color:#B3B5B8 !important; } ul.rMenu li.current_page_item a, li.current_page_item{ color: #B3B5B8 !important; } #menu1 { width: 990px !important; } div#menu1 { border-bottom: 0px solid #461D7C; } ul.rMenu li:hover, ul.rMenu li.sfhover { background-color: transparent !important; } ul.rMenu li.current_page_item>a:link, ul.rMenu li.current_page_item>a:active, ul.rMenu li.current_page_item>a:hover, ul.rMenu li.current_page_item>a:visited, ul.rMenu li a:hover { background-color: transparent !important; } ul.rMenu-ver { margin: 0 !important; list-style: none !important; margin-right: 0px !important; padding-top: 0px !important; border-top: solid 0px #444444; } ul.rMenu-ver li { margin: 0 !important; padding: 0 !important; border-left: solid 0px #f4f4f4 !important; border-right: solid 0px #f4f4f4 !important; border-top: solid 0px #f4f4f4 !important; border-bottom: solid 1px #c5c6c7 !important; } ul.rMenu-ver li a { margin: 0 !important; padding: 0px !important; text-align: right; padding-top: 3px !important; padding-right: 0px !important; height: 20px !important; color: #ffffff !important; font:normal 1.2em Arial !important; background: #8a8c8f !important; border-right: 0px solid #bd3e00 !important; } li.rMenu-expand li { width: 100px !important; /*height: 23px !important;*/ margin-right: 0px !important; margin-top: 0px !important; color: #ffffff !important; background: #8a8c8f !important; } li.rMenu-expand li:hover, .rMenu-expand page_item li:hover { color: #dddddd !important; background: #8a8c8f !important; } .rMenu-expand page_item li { width: 100px !important; height: 23px !important; margin-right: 0px !important; margin-top: 0px !important; color: #dddddd !important; background: #8a8c8f !important; } ul.rMenu ul { background-color:transparent; } div#menu1 ul.sub-menu li:hover > a, div#menu1 ul.sub-menu li a:hover, .rMenu-expand page_item li:hover { color: #dddddd !important; background: #8a8c8f !important; } ul.rMenu-ver ul { top: 5px !important; border-top: 0px solid #bd3e00 !important; } div#menu1 ul.rMenu-hor li.rMenu-expand a { padding-right: 5px !important; } .hevra a{ background-image: url padding-top: 85px; margin-top: 8px; padding-left: 20px; background-position: 40% 0%; background-repeat: no-repeat; } .hevra a:hover{ background-image: url[/url] padding-top: 85px; margin-top: 8px; padding-left: 20px; background-position: 40% 0%; background-repeat: no-repeat; } Please, please need your help :) I know that the problem is really stupid, but I have no idea what it is, all day I'm stuck on it. |
I'll try and take a look thursday, but I'm headding off doing family Christmas Eve stuff and will be offline tomorrow.
|
Thank you. And happy holidays! :)
|
back for a few minutes - try this in the CSS Inserts
HTML Code:
div#menu1 ul.rMenu li.page-item-2.current_page_item a ul li a {background-image: none;}{ |
No it did not help, I have tried so many and nothing helps. :(
Thank you again! |
Here is a slight tweak to that code.
HTML Code:
div#menu1 ul.rMenu li.page-item-2.current_page_item .sub-menu li a { |
Yessss it works!!!! :) Thank you both, you are the best!
Donation on the way! |
All times are GMT -6. The time now is 08:45 PM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.