?
Solved

CSS change font family of nav menu on page

Posted on 2014-01-23
4
Medium Priority
?
380 Views
Last Modified: 2014-01-24
I'm missing something in the way my CSS is cascading.

I am trying to install a google font on the navigation menu of this site but wherever I put it nothing is overwriting what is currently there.  Any help would be appreciated.

Thanks,

http://sendright.com/draft/lauren/
0
Comment
Question by:gwarcher
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 15

Expert Comment

by:Insoftservice
ID: 39805670
What part of your css is overwritten.
Please elaborate.
Which ever part is getting overwritten you could use   !important for your required css so as to avoid such problems
0
 
LVL 53

Accepted Solution

by:
Scott Fell,  EE MVE earned 2000 total points
ID: 39805817
I see you loaded the css file, I don't see you assigned the font.

In your custom css you need to add,

font-family: 'name_of_font',

Open in new window

 
See the instructions for your particular font on the 3rd step http://www.google.com/fonts#UsePlace:use

You should be able to assign using

ul#menu-menu-1 li a{font-family:'name_of_font',sub_font;}

You either need to put this at the buttom of your style.css file or create a custom css file that is loaded after the style.css file or the !important hack.

Your current font is in your style.c line 407
media="all"
.main-navigation a {
border-radius: 3px;
color: #998675;
display: block;
line-height: 21px;
margin: 7px 10px;
padding: 5px 10px;
text-decoration: none;
font-family: Calibri;
font-weight: bold;
font-size: 14px;
}

Open in new window



As a side note, if I have the font Calibri on my system, I will see this as Calibri.  That font came with my Mac.  I don't know if it comes standard on a windows machine. I know for sure it does not come loaded on the older pc's.  And I did not see Calibri loaded in your google font css files.
0
 
LVL 17

Expert Comment

by:nanharbison
ID: 39806202
Calibri is a standard font on Windows now, it was on my Windows 7 machine pretty many years ago.
What is the name of the font you want to use?
Also, are you using Firebug to try to add the font to the elements in your CSS? It helps you see where to put the font style.
0
 

Author Closing Comment

by:gwarcher
ID: 39807264
thanks worked great
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses
Course of the Month14 days, 16 hours left to enroll

771 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question