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 »

background-image for Sub-menu items / ul.children


  #1  
Old Jul 14, 2010, 12:41 AM
Fux
 
142 posts · Apr 2009
I got this problem with my sub-menu items - the white space where the background-image is not applied. I _could_ fix this by applying the background to ul.children, but that is also used for the comments section, causing trouble there. How can I fix this?



URL is http://www.urgeschmack.de
  #2  
Old Jul 14, 2010, 04:56 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
go look for a fix in the 'New Versions' forum
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Jul 14, 2010, 08:02 AM
Fux
 
142 posts · Apr 2009
Thank you very much.
  #4  
Old Jul 17, 2010, 06:10 AM
Fux
 
142 posts · Apr 2009
I applied that fix but the situation did not change. What else could I do to fix this?
  #5  
Old Jul 17, 2010, 06:29 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Make sure you don't have any caching plugins active or it will take time for the fix to how up
Set your CSS to internet so I can take a peek
__________________
"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 17, 2010 at 06:31 AM.
  #6  
Old Jul 17, 2010, 08:09 AM
Fux
 
142 posts · Apr 2009
No Caching plugins, CSS Debugging set to 'yes', double-checked my CSS inserts to not make a fool out of myself once again (but probably will...)
  #7  
Old Jul 17, 2010, 09:09 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
look in your CSS Inserts for the following
HTML Code:
ul.rMenu li {
margin:0px 22px;
color:#eee !important;
font-weight:bold;
background:url(/wp-content/uploads/ug_pagemenu_buttonBG.png) repeat-x top left
}
and change the margin:0px 22px; to padding:0px 12px;
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #8  
Old Jul 18, 2010, 02:22 AM
Fux
 
142 posts · Apr 2009
Thank you, that fixed it - but introduced a new problem. By using padding instead of margins, the buttons have become wider and there seems to be a difference in hovering over the button versus hovering over the text link in the button, each changing to a different color while hovering.

To fix this as well, I changed the setting back to "margin" and just added:

li.page-item-1041 {
padding:0px 22px;
margin: 0px 0px !important;
}

for that specific sub-menu item.

The main problem seems to be to override the background-color settings from the Ata "Page Menu Bar" styling-set. It seems to make sense to either write a short how-to/faq on how to change the page menu bar to a image based bar with changing graphics for hover etc. OR to add options to use images straight on the "Page Menu Bar" settings page.

For example, to get the menu bar to work like this http://www.urgeschmack.de (and one main issue was the button spacing because the Ata standard-spacing just did not look good)m I had to use this code:

div#menu1 {
border: none;
background: url(/buttonBG.png) repeat-x top left;
}
div#menu1 ul.rMenu {
background: url(/buttonBG.png) repeat-x top left;
}

ul.rMenu li {
margin: 0px 22px;
color: #eee !important;
font-weight:bold;
background: url(/buttonBG.png) repeat-x top left;
}
li.page-item-1041 {
padding:0px 22px;
margin: 0px 0px !important;
}

ul.rMenu li a:hover,
.page-item a:hover {
text-decoration:underline;
color: #fff !important;
background: url(/buttonBG_hover.png) repeat-x top left;
}

So another good option might be to add "Page menu bar item width" or something similar.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Why do children items have parents hover color. FlippinSweet Page & Category Menu Bars 8 Jun 28, 2010 12:04 PM
Problem changing the background color of just one of the page menu items\buttons Thomas Page & Category Menu Bars 3 Jun 6, 2010 05:38 PM
Background Image for Category Menu Items joan Page & Category Menu Bars 3 Apr 19, 2010 03:30 AM
[SOLVED] Background image of child items not the same as parent noahinBR Header configuration & styling 2 Feb 4, 2010 12:43 PM
How to use background images for menu items instead of text daxryan Page & Category Menu Bars 2 Feb 27, 2009 04:29 PM


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


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