Wordpress Themes - WP Forum at BFA - [SOLVED] Page menu background color

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Page & Category Menu Bars (http://forum.bytesforall.com/forumdisplay.php?f=10)

- - [SOLVED] Page menu background color (http://forum.bytesforall.com/showthread.php?t=8647)

tommaso

Aug 1, 2010 10:36 PM

[SOLVED] Page menu background color

1 Attachment(s)

Hi forum-

I'm loving what i can do with Atahualpa, but i've run in to trouble...

I can't seem to get the background left and right of the page menu buttons to match the button colors. It's currently yellow like the page background, but should be the red of the buttons.

I've reviewed every thread I could find, appended juggledad's and georgenoise's recommended code to the css, etc.

Any help at all would be appreciated. I'm running WP 3.0.1 and Atahualpa 3.5.3.

here's the dev site: http://italyadagio.com/wp/

attached also is the export of my settings

Thanks y'all
-tommaso

GillM

Aug 2, 2010 04:33 AM

Quote:

Originally Posted by tommaso (Post 38976)

This is the same problem that I reported on this thread - the problem only occurs if you use the setting %page-center, if you use %pages and the following code it works fine.

Code:

div#menu1 {

background: #??????;

border: none;

}

Obviously replacing #?????? with the hex code of the colour you require. I'm still awaiting an answer as to how to achieve this when using the %page-center setting.

Gill

lmilesw

Aug 2, 2010 06:47 AM

I am able to set the background colors fine in ATO>Page menu and the placement of the menu makes no difference.

GillM

Aug 2, 2010 07:43 AM

Quote:

Originally Posted by lmilesw (Post 39003)

I am able to set the background colors fine in ATO>Page menu and the placement of the menu makes no difference.

How are you colouring the background to the right / left of the menu? I cannot see where you would do this on the ATO>Page Menu screen.

Gill

lmilesw

Aug 2, 2010 07:59 AM

What you may be dealing with is some CSS that is part of the default style for Atahualpa. Take a look in ATO>Add HTML/CSS Inserts>CSS Inserts and look for Items for menus. Sometimes what is helpful is to copy all the CSS in the CSS Inserts area and paste it into a notepad file to save the text and then delete everything in the box and look at your site. You will then see what is being done by the CSS.

GillM

Aug 2, 2010 08:10 AM

Quote:

Originally Posted by lmilesw (Post 39010)

This is all that is in that area, does it shed any light on the problem?

Code:

div#menu1 ul.rMenu li a:link, 

div#menu1 ul.rMenu li a:hover, 

div#menu1 ul.rMenu li a:visited, 

div#menu1 ul.rMenu li a:active {

        font-weight: bold;

        padding: 5px 20px 5px 20px;

                }



div#menu1 ul.rMenu {

background: #deedef;

padding: 2px 2px 2px 2px;

}



div.widget ul li {border-bottom:1px dotted #DEEDEF;

                }

Gill

lmilesw

Aug 2, 2010 08:41 AM

Could you please post a URL?

GillM

Aug 2, 2010 09:02 AM

Quote:

Originally Posted by lmilesw (Post 39018)

Could you please post a URL?

Thanks for your speedy replies...

It's a test site at the moment - http://aim3.journalcraft.co.uk/
Sorry, I seem to have hijacked this thread, but it seemed to be related to the question I posted here about using a background image with the menu.

Gill

lmilesw

Aug 2, 2010 10:33 AM

What do you have in your configure header area box?

GillM

Aug 2, 2010 12:14 PM

Quote:

Originally Posted by lmilesw (Post 39025)

What do you have in your configure header area box?

This -

Code:

%logo %page-center %image

As I have said, when I use %logo %pages %image, the background, whether a colour or image, will show, but as soon as I change the page setting here it disappears :confused:
Gill

lmilesw

Aug 2, 2010 12:50 PM

I figured out what is happening but I don't have a fix as yet. This problem occurs when you use the WordPress menu builder.

GillM

Aug 2, 2010 12:56 PM

Thanks Larry, I look forward to hearing from you when you have sorted out a fix :)

lmilesw

Aug 2, 2010 01:10 PM

On a whim I tried the following and it worked. Wrap %page-center with a div and style it.

HTML Code:

<div style="width:100%;background-color:#xxxxxx;">%page-center</div>

GillM

Aug 2, 2010 02:17 PM

1 Attachment(s)

That has worked - thank you!

However, there is one remaining niggly problem. When I first tried this I found I had a dashed grey border around the actual menu items. So I included the following code into the Add HTML / CSS Inserts area (this is the entire code in this area)

Code:

div#menu1 ul.rMenu li a:link, 

div#menu1 ul.rMenu li a:hover, 

div#menu1 ul.rMenu li a:visited, 

div#menu1 ul.rMenu li a:active {

        font-weight: bold;

        padding: 5px 20px 5px 20px;

        border: none;

                }



div.widget ul li {border-bottom:1px dotted #DEEDEF;

                }

The code I have in the Style Header box is as follows -

Code:

%logo <div style="width:100%;background: url(/wp-content/themes/atahualpa353/images/menu-bar-bg.gif);" %page-center</div> %image

I tried adding the border: none instruction here but it had no effect.

Anyhow, the problem that remains is that most of the grey dashed border has gone, but the left border still remains - to the left of HOME - you can just about see it in the thumnail attached

Any ideas?

Thanks
Gill

lmilesw

Aug 2, 2010 02:36 PM

Try this.

HTML Code:

.menu-page-menu-container {border:1px solid #DEEDEF !important;}

Firebug is wonderful

GillM

Aug 2, 2010 03:15 PM

WONDERFUL - it worked :) Thank you so much for your prompt help.

I hope this has solved tommaso's problem too.

I will put a note on my original thread, as that has now been fixed too.

Thanks again Larry
Gill

All times are GMT -6. The time now is 02:07 AM.