Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Page & Category Menu Bars »

Remove menu background graphic on drop down menu area


  #1  
Old Jul 24, 2012, 11:09 AM
blueprairie
 
98 posts · Feb 2009
Hi there!

I have a sub-menu that isn't displaying well. Can you take a peek at http://eolhealth.server308.com/ and let me know if there is a way to remove the menu background graphic from the drop-down menu area (I just want a bgcolor there)? And then for items 2 and beyond there is no background at all. The only menu with sub-pages is "Frankly Speaking."

Thank you!
-Kimberly
  #2  
Old Jul 24, 2012, 05:14 PM
juggledad's Avatar
juggledad
 
23,576 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
you need to reset the image and color for the submenu. try this (you will want to change the colors
HTML Code:
div#menu1 ul.rMenu li ul {
background-image: none !important;
background-color: #ff0099 !important;
}

div#menu1 ul.rMenu li ul li {
background-image: none;
background-color: #ff0099 !important;
}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Last edited by juggledad; Jul 31, 2012 at 02:49 PM.
  #3  
Old Jul 31, 2012, 02:39 PM
zingo5
 
92 posts · Sep 2011
I used the above code to make my drop down items a light blue. When I highlight them everything works fine they turn dark blue as desired. However I have it set so the menu item for the current page displays as dark blue.

If you hover over the menu item of the current page the whole drop down menu opens in dark blue when the children should be light blue.

Ex. If you go here and hover the mouse over 'First Steps' everything is correct.

If you go to this page and hover the mouse over 'First Steps' the whole drop down menu opens in dark blue instead of light blue.
  #4  
Old Jul 31, 2012, 02:58 PM
juggledad's Avatar
juggledad
 
23,576 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
css can get very complicated and menu CSS espically so. The CSS for the menu has over 400 lines.

in your case when you click on 'First Steps' it gets the class of 'current_page_item'.

remember CSS has an order of precidence and if there are two CSS Selectors that could apply to the same code, the one that is more specific would apply AND since CSS cascades the rules apply to the child elements also.

so you need to reset the color for items that are subsequent when it has the class 'current_page_item'
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Jul 31, 2012, 03:26 PM
zingo5
 
92 posts · Sep 2011
Wow I'm impressed that you could understand my post and write an answer I could understand within 15 minutes. I am assuming that the css inserts in the theme options take priority over everything except css within a page so I added this at the end of the css inserts but it didn't work.

div#menu1 ul.rMenu li.current_page_item li ul{
background-image: none !important;
background-color: #c6d5ea!important;
}


div#menu1 ul.rMenu li.current_page_item li ul li{
background-image: none !important;
background-color: #c6d5ea!important;
}
  #6  
Old Jul 31, 2012, 03:42 PM
juggledad's Avatar
juggledad
 
23,576 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
try this
HTML Code:
div#menu1 ul.rMenu li.current_page_item ul li a:link, 
div#menu1 ul.rMenu li.current_page_item ul li a:active, 
div#menu1 ul.rMenu li.current_page_item ul li a:hover, 
div#menu1 ul.rMenu li.current_page_item ul li a:visited, 
div#menu1 ul.rMenu li ul li a:hover {
    background-color: #c6d5ea;
    color: #000000;
}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Jul 31, 2012, 03:58 PM
zingo5
 
92 posts · Sep 2011
That makes the drop down list of the current page light blue again, but it prevents you from selecting an item in it and making that item dark blue when you hover the mouse over it.
  #8  
Old Jul 31, 2012, 04:10 PM
juggledad's Avatar
juggledad
 
23,576 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
move the hover out to its own css
HTML Code:
div#menu1 ul.rMenu li.current_page_item ul li a:link, 
div#menu1 ul.rMenu li.current_page_item ul li a:active, 
div#menu1 ul.rMenu li.current_page_item ul li a:visited, 
div#menu1 ul.rMenu li ul li a:hover {
    background-color: #c6d5ea;
    color: #777777;
}
div#menu1 ul.rMenu li.current_page_item ul li a:hover {
    background-color: #c6d5ea;
    color: #000000;
}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #9  
Old Jul 31, 2012, 05:28 PM
zingo5
 
92 posts · Sep 2011
Almost. I changed the last color in your code to #5A85C1

The menu now works properly if you are on the First Steps Page

but the dropdown list won't change color on hover if you are on any other page. You are right menu css can get a lot more involved than I thought!

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Page Menu drop down modification - remove arrows & extra space dorigen Page & Category Menu Bars 31 Aug 16, 2014 12:10 PM
Background menu image not extending into child (drop down) menus tim55057 Page & Category Menu Bars 1 Nov 29, 2011 06:35 PM
Graphic roll-over selector for main menu nick51 Header configuration & styling 1 Dec 2, 2010 01:38 PM
[SOLVED] Menu background colour on drop down PAFISH Page & Category Menu Bars 2 Aug 18, 2010 08:23 AM
How do I move drop down menu bar for pages under logo area and header image? barfarf Header configuration & styling 1 Apr 22, 2009 12:49 PM


All times are GMT -6. The time now is 08:26 PM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.