Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

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

[SOLVED] How to style sub-menu items separately


  #1  
Old Jun 22, 2010, 08:57 AM
Fux
 
142 posts · Apr 2009
I would like to style the sub-menu items of my page menu bar separately (i.e. green background, white font, white line in between the items instead of the "green-on-white" styling of the parent items). How can I accomplish that? I've looked all around this forum and haven't found anything.

If you'd just let me know which selector to use, I think I can handle the rest. Thanks!
  #2  
Old Jul 2, 2010, 11:43 PM
Fux
 
142 posts · Apr 2009
bump - can anyone help me?
  #3  
Old Jul 3, 2010, 04:10 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Do a search for 'juggledad menu color cheat sheet' and see if it helps you
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #4  
Old Jul 8, 2010, 02:06 AM
Fux
 
142 posts · Apr 2009
Thank you, but I knew that one. It does not list the selectors for sub-menu items in the page bar. Is there no way to style those separately?
  #5  
Old Jul 8, 2010, 04:34 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
if you mean that you have page 'A' which has subpages 'B' and 'C' and page 'D' which has subpages 'E' and 'F', and you want to style 'C' and 'D' different than 'E' and 'F', you can do that. You will haveto look at the source of your page and look at the menu. each PAGE will have a LI like this
HTML Code:
<li class="rMenu-expand page_item page-item-2"><a href="http://yourdomain.com/?page_id=2" >About</a>
this particular page has subpages (you can tell by the class 'rMenu-expand' and by the UL following this line in the code) and it has a unique class 'page-item-2' so you can target this pages subpages in your CSS Selectors. Each page would have it's own CSS Selector and rules so they can be different.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #6  
Old Jul 9, 2010, 02:10 AM
Fux
 
142 posts · Apr 2009
Thank you. Based on you example, I did not want to stype C, D different than E, F. But I still just could not find a way to do this. Using rMenu-expand did not work before, but it seems I should have used "!important" earlier. Thanks again.
  #7  
Old Jul 29, 2013, 03:33 PM
jrobie23's Avatar
jrobie23
 
63 posts · Feb 2011
Boulder, CO
Juggledad... any chance you can correct my syntax here...

Trying to style the sub-sub menus off of the main nav using your advice from above...

li#menu-item-2029 .rMenu-ver sub-menu {
width: 45em;
}

http://badgerrealty.com

menu item 2029 is the li ID from the drop-down off of the main nav. (towns).

I had successfully adjusted the nav drop-down and the sub nav drop-down, but then realized that my "agents" drop-down was too narrow. NOW, I want to style each of those pesky things individually. If I can get ONE to work, I'll be able to get the others as well...

jr
  #8  
Old Jul 29, 2013, 05:18 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
when you have an element with two (or more) classes and you want to target that element using both classes you use the format
HTML Code:
.class1.class2
if you seperate them by a space then you are looking an element with 'class2' that is a child of the element with the class 'class1'
  #9  
Old Jul 30, 2013, 07:10 AM
jrobie23's Avatar
jrobie23
 
63 posts · Feb 2011
Boulder, CO
i get the sense you should be teaching css classes!!

Thank you for the help and "teaching me to fish". always appreciated.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Drop Down Menu items overlapping menu bar 360woman Page & Category Menu Bars 4 Apr 21, 2010 09:40 AM
Further Edits to font and font style of page/category menu items please? rhythm Page & Category Menu Bars 1 Feb 26, 2010 10:52 PM
[SOLVED] Page Menu Bar - Strange Space Occurring Between Menu Items NealSchaffer Page & Category Menu Bars 2 Jun 20, 2009 10:18 AM


All times are GMT -6. The time now is 07:20 PM.


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