Community Forums › Forums › Archived Forums › Design Tips and Tricks › URGENT: Need CSS help please
Tagged: css, footer, genesis, menu, Production
- This topic has 5 replies, 3 voices, and was last updated 11 years, 10 months ago by leannemorrison.
-
AuthorPosts
-
December 14, 2012 at 11:11 pm #5357leannemorrisonParticipant
Hi, I am using Genesis + Production theme, and have my test site set up here http://clientsites.jonmorrison.com.au.
The bit I need help with please, is the secondary menu (Home, About Bendalls Group, etc). The original menu bar was grey, but my client wants it to be black. This has made the text for the page headings very difficult to see. I cannot find where to change the colour for these :). Looking at the stylesheet, it appears that there could be some sort of text shadow too.
Also too, I would like to change the font colour in the footer to a lighter colour. I can't work that one out either 🙂
I have managed to work my way around most of the other changes, but these ones have me stumped. I would really appreciate it if someone could point out what I need to do please. Please be gentle, as I do not know much about CSS.
Many thanks in advance
Leanne Morrison
December 15, 2012 at 12:23 pm #5429Aaron HartlandMemberThe color of the menu items is being set in this block of css (#555 being the current color):
div .menu-primary a,
div .menu-primary a:visited,
div .menu-secondary a,
div .menu-secondary a:visited,
#header .menu a,
#header .menu a:visited {
color: #555;
display: block;
font-size: 14px;
line-height: 18px;
margin: 0;
padding: 6px 10px;
position: relative;
text-decoration: none;
text-shadow: 1px 1px #F6F6F6;
}There is also text-shadow in this css, but it's not the only spot. Also see:
div .menu-primary,
div .menu-secondary {
color: #555;
font-size: 14px;
text-shadow: 1px 1px #F3F3F3;
text-transform: uppercase;
}For the color of the paragraph text in your footer widgets, find this:
#footer-widgets p {
font-size: inherit;
margin: 0 0 10px;
}and add a color line like so:
#footer-widgets p {
color: inherit;
font-size: inherit;
margin: 0 0 10px;
}This will pull in the color that is being set in for the #footer-widgets
I hope that helps!
Aaron Hartland | http://www.aaronhartland.com
Twitter | Facebook | LinkedIn | Google+December 15, 2012 at 6:09 pm #5479leannemorrisonParticipantTHANK YOU so much Aaron, that did the trick. Just one other thing please?
Naturally when I started changing colours, it had a flow on effect, and you fix something here, and some other issue pops up there ....
In the menu (Home, About Bendalls, Projects & Case Studies etc), I have CHANGED the background to black and the text now to white. I have also changed the dropdowns from a white background to black, with light grey text.
Due to the fact I changed the main menu text to white, it does not show up against the white background when these pages are hovered over.
I would like to change the hover menu items to dark grey with black text. Where would I change these please?
Many thanks in advance
Leanne
December 15, 2012 at 6:21 pm #5482leannemorrisonParticipantDon't worry - I fixed it!
For anyone else looking for the answer, I went to
#header .menu .current-menu-item a { background: none repeat scroll 0 0 #666666; text-shadow: none;
and changed the colour there.
Thanks once again for your assistance Aaron. You are a lifesaver!
December 17, 2012 at 3:21 pm #5808CharlieLParticipantPlease, do yourself a favor and use the tools available in your browser to find out where to change certain CSS.
For Firefox you can use FireBug. Install the plugin and play with it a little and you will discover its power.
In Chrome there is a tool built-in. Right-click and choose the option at the bottom of the list, something like "check component" in a free translation. I do not use the English version.
Opera also have built-in developer-tools that works very much like FireBug.
You will save yourself a lot of frustration if you use these tools. They can take some time to get used to but that is well worth the time.
Enjoy!
December 17, 2012 at 11:11 pm #5876leannemorrisonParticipantOh Charlie, you are surely my Christmas present! A big thank you. I had no idea about Firefox and Firebug. It makes life so much simpler! I was a Google only girl, but have now downloaded Firefox and Firebug and can see what you are talking about.
Once again my sincere thanks to you and all those who have given me assistance with this. I really really appreciate it.
Merry Christmas and Cheers to you all
Leanne
-
AuthorPosts
- The topic ‘URGENT: Need CSS help please’ is closed to new replies.