Jump to content

Archived

This topic is now archived and is closed to further replies.

photomom86

Nav bar font color

Recommended Posts

photomom86

Hello again, I have some custom css to make the blue nav bar a different color:

 

.navbar.pl-color-blue {

 
background-color: #507282;
 
background: -moz-linear-gradient(center top , #81c43a, #81c43a);
 
background: -webkit-gradient(linear, left top, left bottom, from(#81c43a), to(#81c43a));
 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#81c43a', endColorstr='#81c43a');
 
background-repeat: repeat-x;
 
border-top: 1px solid #81c43a;
 
}
 
this works great. Love it. I'd like to add to it to make the font color (on hover or not) to be a different color than it is. It seems to be defaulting to white or something light.
 
any help?
 
Thanks!

Share this post


Link to post
Share on other sites
James B

Hi there, the color for the text inside the navbar requires a slightly different selector.

 

.navbar .navline > li > a {
    color: #000000;}

Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
photomom86

thank you! Now tell me, is there a way to make the font size a bit bigger?

Share this post


Link to post
Share on other sites
batman

Hi photomom86

 

Please, you can try to add in

Custom > Custom CSS/LESS

or in 

Child theme

 
.navbar .navline.pull-right {
    margin-top: 2.3em;
    font-size: 1em;}

Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
photomom86

hmmm all that did was made the nav bar larger but the font the same? I added it in Custom>Custom CSS/LESS.

Share this post


Link to post
Share on other sites
batman

Hi again

You can try with

font-size: 2em

for example

Can you provide a link to your website please. 


Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
Danny

photomom86 -  Try the following:

 

#site .navbar .navline > li > a {
    font-size: 22px;
}
 
Also, in future can you follow forum policy and only have one question per topic please. If my suggestion above doesn't work for you can you please create a new topic, as your original question was answered by James. Therefore, I have resolved the topic.

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
photomom86

ok I apologize. Thanks!

Share this post


Link to post
Share on other sites
Danny

Thanks :D


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

×