Community Forums › Forums › Archived Forums › Design Tips and Tricks › Navigation Bar help needed.
Tagged: http://dugganmarketing.com.au
- This topic has 12 replies, 2 voices, and was last updated 10 years, 4 months ago by keystone.
-
AuthorPosts
-
November 14, 2013 at 9:19 pm #73071keystoneMember
I want to make my navigation bar semi opaque and leave the text at 100% but when I add the word "opacity" it is changing the text as well.
Can anyone point me in the right direction please?
Theme is Executive Pro.
Thanks in advance for any assistance
Gordon J
Keystone Internet Solutions – Your Web Development and Positioning Professionals.
November 14, 2013 at 10:47 pm #73084nutsandboltsMemberHi Gordon,
Can you post a link to your site? It's easier for us to help if we can see the issue.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 14, 2013 at 11:20 pm #73100keystoneMemberThanks...yes I can http://dugganmarketing.com.au
Keystone Internet Solutions – Your Web Development and Positioning Professionals.
November 15, 2013 at 9:51 am #73149nutsandboltsMemberOkay, try this. You'll need to change this in two places in your stylesheet or it won't work.
First, find this in your stylesheet:
.genesis-nav-menu { background-color: #000000; clear: both; color: #666; font-size: 14px; font-size: 1.4rem; line-height: 1.5; margin: 0; overflow: hidden; padding: 0; width: 100%; }
and change it to this:
.genesis-nav-menu { background: rgba(0, 0, 0, 0.5); clear: both; color: #666; font-size: 14px; font-size: 1.4rem; line-height: 1.5; margin: 0; overflow: hidden; padding: 0; width: 100%; }
Then find this:
.nav-primary { background-color: #000000; }
and change it to this:
.nav-primary { background: rgba(0, 0, 0, 0.5); }
That should give you enough transparency for some of the background texture to show through, but without dimming your text.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 15, 2013 at 7:31 pm #73323keystoneMemberHi Andrea...thanks that worked fine. Now I have realised that removing the inner background also removes the background on posts and pages so I am trying to find a way around that...just testing a plugin called "custom background extended" that I hope will keep me transparent on the front page but provide background for my pages and posts...
Keystone Internet Solutions – Your Web Development and Positioning Professionals.
November 15, 2013 at 10:12 pm #73343nutsandboltsMemberYou should be able to do something like
#home .inner
or maybe#home #inner
to removing it only on the homepage. It may take a few tries to figure out exactly how it wants it to be, but similar things have worked for me on other sites.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 15, 2013 at 11:00 pm #73352keystoneMemberThanks again...you have been most kind
Keystone Internet Solutions – Your Web Development and Positioning Professionals.
November 15, 2013 at 11:01 pm #73353nutsandboltsMemberNo problem! Let me know if that doesn't work and I'll be glad to take a look again.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 25, 2013 at 9:13 pm #75625keystoneMemberHi again Andrea....I promise not to keep bugging you with things but I thought you might be able to answer a quick question faster than me just putting another one on the forum.
Is it possible to make the individual menu items on the nav bar appear in the middle of the bar rather than starting from the left...but still enable me to add more menu items while keeping the wording centralised.
Keystone Internet Solutions – Your Web Development and Positioning Professionals.
November 25, 2013 at 9:16 pm #75627nutsandboltsMemberYep! You can certainly do that. Just find this in your stylesheet:
.genesis-nav-menu { background-color: rgba(0, 0, 0, 0.0); clear: both; color: #666; font-size: 14px; font-size: 1.4rem; line-height: 1.5; margin: 0; overflow: hidden; padding: 0; width: 100%; }
And change it to this:
.genesis-nav-menu { background-color: rgba(0, 0, 0, 0.0); clear: both; color: #666; font-size: 14px; font-size: 1.4rem; line-height: 1.5; margin: 0; overflow: hidden; padding: 0; width: 100%; text-align: center; }
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 25, 2013 at 9:51 pm #75633keystoneMemberYou are an absolute GEM...thank you....
If I weren't married (and probably more than twice your age...) lol
Keystone Internet Solutions – Your Web Development and Positioning Professionals.
November 25, 2013 at 9:52 pm #75634nutsandboltsMemberHahaha! I've had to explain to my husband more than once that telling some coder "I think I love you" for helping me is totally not flirting, that it's just part of the relief of getting a problem solved! 🙂
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 25, 2013 at 9:53 pm #75635keystoneMemberlol...thanks again
Keystone Internet Solutions – Your Web Development and Positioning Professionals.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.