Apply Calibri (Body) font to text

Question

I have a div and in this div I want to display some text in Calibri (Body) font.

How can I do this?

This is the css I have been given :

.an_account_join_1 {     float:left;     width:100%;     color:#000000;     font-family:Calibri (Body);     letter-spacing:2px;     font-size:14px;     text-align:center;     margin:20px 0px;     }    

This is the div:

<div class="an_account_join_1">Individual Free Membership</div> 

There is no font style displayed with this font family.

When I look at the firebug output there is no style for font family.

Answer 1

There is no such font as “Calibri (Body)”. You probably saw this string in Microsoft Word font selection menu, but it’s not a font name (see e.g. the explanation Font: +body (in W07)).

So use just font-family: Calibri or, better, font-family: Calibri, sans-serif. (There is no adequate backup font for Calibri, but the odds are that when Calibri is not available, the browser’s default sans-serif font suits your design better than the browser’s default font, which is most often a serif font.)

Answer 2

change the font type for div use

.an_account_join_1{ font-family:"Calibri, sans-serif"; } 

for the main menu in WordPress

#primary-menu{     font-family:"Calibri, sans-serif";     }