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 »

[SOLVED] page menu bar transparant


  #1  
Old Apr 26, 2010, 05:52 PM
byronyasgur
 
17 posts · Feb 2009
Trying to get the page menu bar <li>'s to have a transparant background - i can set the color in the theme options and i can then override this colour using div#menu1 ul.rMenu li in the css area but if i put in
div#menu1 ul.rMenu li{
background: transparant !important;
}


then i get no effect - i cant work it out ( i have tried all kinds of specificity ) - anyone any ideas

ultimately what i'm doing is that i've set the background image on the entire menubar to a slice of what im using in the header so the menu looks like it's floating on the header image
see attached file

thanks
Attached Thumbnails
Click image for larger version

Name:	pagesbar.png
Views:	504
Size:	44.7 KB
ID:	478  
  #2  
Old Apr 27, 2010, 08:40 AM
juggledad's Avatar
juggledad
 
23,686 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
What version of Atahualpa and WP?
What is the url?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Apr 27, 2010, 10:59 AM
byronyasgur
 
17 posts · Feb 2009
wp 2.9.2
at 3.4.6

it's a local development project so no url
  #4  
Old Apr 27, 2010, 05:28 PM
juggledad's Avatar
juggledad
 
23,686 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Here is my handy little cheat sheet for dealing with the two menu's and the parts. Put this at the end of your css and you can see graphically, what effects what. It should be enough to get you going.
HTML Code:
/* ================================================ */
/* Page menu background                             */
/* ================================================ */
div#menu1 { 
	height: 40px;  
	margin-top:0px; 
	background: #blue; 
}
/* ================================================ */
/* Page Menu item's background and border           */
/* ================================================ */
div#menu1 ul.rMenu {
	background: #red;
	border: none 0px; 
}
/* ================================================ */
/* Page Menu item                                   */
/* ================================================ */
ul.rMenu li a:link, 
ul.rMenu li a:hover, 
ul.rMenu li a:active, 
ul.rMenu li a:visited, 
ul.rMenu li {
	background: #yellow !important;
	color: #000000 !important;
}
/* ================================================ */
/* Category menu background                         */
/* ================================================ */
div#menu2 { 
	height: 40px;  
	margin-top:0px; 
	background: #green; 
}
/* ================================================ */
/* Category Menu item's background and border       */
/* ================================================ */
div#menu2 ul.rMenu {
	background: #orange;
	border: none 0px; 
}
/* ================================================== */
/* Category Menu item                                 */
/* ================================================== */
#menu2 ul.rMenu li a:link, 
#menu2 ul.rMenu li a:hover, 
#menu2 ul.rMenu li a:active, 
#menu2 ul.rMenu li a:visited, 
#menu2 ul.rMenu li {
	background: #purple !important;
	color: #000000 !important;
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++ */
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Apr 27, 2010, 08:44 PM
byronyasgur
 
17 posts · Feb 2009
thanks - i had a look at that before ---- but the problem is definitely with div#menu1 ul.rMenu li .... i have managed to get it to change colour but not to be able to set it to transparant, that's unless something else behind it is picking up on the colour from the theme options, but i dont think that's the case

it looks like a <a> in a <li> in a <ul> and i can affect change to the <a> and the <ul> - i just cant make the <li>'s background transparant
  #6  
Old May 4, 2010, 06:30 AM
byronyasgur
 
17 posts · Feb 2009
got it ..... it turned out to be easy

HTML Code:
div#menu1 ul.rMenu li{
background: transparent !important;
}
but that left the current item to be taken care of ... it was
HTML Code:
div#menu1 ul.rMenu li.current_page_item a:link, div#menu1 ul.rMenu li.current_page_item a:active, div#menu1 ul.rMenu li.current_page_item a:hover, div#menu1 ul.rMenu li.current_page_item a:visited, div#menu1 ul.rMenu li a:hover{
background: transparent !important;
}
the full css that I used was

HTML Code:
div#menu1 ul.rMenu li, 
div#menu1 ul.rMenu li.current_page_item a:link, div#menu1 ul.rMenu li.current_page_item a:active, div#menu1 ul.rMenu li.current_page_item a:hover, div#menu1 ul.rMenu li.current_page_item a:visited, div#menu1 ul.rMenu li a:hover{
background: transparent !important;
}

div#menu1 ul.rMenu li.current_page_item a{
color:#fff !important;
padding-top:2px !important;
padding-bottom:2px !important;
}

ul#rmenu2{
background: transparent url(http://yoursite.com/wordpress/wp-content/themes/atahualpa/images/header/header.jpg) bottom !important; 
height:25px;
}
however i think i combined this with some strategic heights etc in the header section of the theme options
Attached Thumbnails
Click image for larger version

Name:	One Week of Days.jpg
Views:	446
Size:	24.2 KB
ID:	484  

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Atahualpa Page Menu Bar -&gt; BFA Page Menu Bar? bhannemann Page & Category Menu Bars 16 Feb 21, 2011 05:49 AM
[SOLVED] Static Pages on the Category Menu Bar instead of Page Bar jkfly4 Page & Category Menu Bars 4 Mar 27, 2010 04:06 AM
Removing (Top) Page Menu Bar - Displaying page menu in left column instead DrewD Page & Category Menu Bars 1 Mar 18, 2010 01:03 PM
category menu bar instead of page menu bar seneque Page & Category Menu Bars 0 Mar 7, 2010 10:20 AM
[SOLVED] How to create spacing between page menu bar, side bar, and footer? ssoszka Atahualpa 3 Wordpress theme 4 Nov 29, 2009 11:39 AM


All times are GMT -6. The time now is 04:54 AM.


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