Font embedding for the Web

[manudeep]

Hello guys.....

i have been working with embedding fonts for a website.

i have made some '.eot' files that contain these fonts, however i was wondering where in the <style> corner i shall feed the css-code fot my fonts.

The orginal style code for my forum looks like this:

----------------------------------------------
 <STYLE type=text/css>
A:link {COLOR: #005177; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
A:visited {
   COLOR: #005177; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
A:hover {
   COLOR: #cc3333; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
.nav {
   COLOR: #000000; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
.nav:link {
   COLOR: #000000; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
.nav:visited {
   COLOR: #000000; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
.nav:hover {
   FONT-WEIGHT: bold; COLOR: #cc3333; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline
}
BODY {
   FONT-SIZE: 12px; FONT-FAMILY: Verdana, arial, helvetica, serif
}
TABLE {
   empty-cells: show
}
TD {
   FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Verdana, arial, helvetica, serif
}
INPUT {
   FONT-SIZE: 9pt; COLOR: #000000; FONT-FAMILY: Verdana,arial, helvetica, serif; BACKGROUND-COLOR: #afc6db
}
TEXTAREA {
   FONT-SIZE: 9pt; COLOR: #000000; FONT-FAMILY: Verdana,arial, helvetica, serif; BACKGROUND-COLOR: #afc6db
}
SELECT {
   FONT-SIZE: 7pt; COLOR: #000000; FONT-FAMILY: Verdana,arial, helvetica, serif; BACKGROUND-COLOR: #afc6db
}
.windowbg {
   FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Verdana, arial, helvetica, serif; BACKGROUND-COLOR: #afc6db
}
.windowbg2 {
   FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Verdana, arial, helvetica, serif; BACKGROUND-COLOR: #f8f8f8
}
.windowbg3 {
   FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Verdana, arial, helvetica, serif; BACKGROUND-COLOR: #6394bd
}
.hr {
   COLOR: #6394bd; BACKGROUND-COLOR: transparent
}
.titlebg {
   COLOR: #ffffff; BACKGROUND-COLOR: #6e94b7
}
.text1 {
   FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: #ffffff; FONT-STYLE: normal; BACKGROUND-COLOR: transparent
}
.catbg {
   FONT-WEIGHT: bold; FONT-SIZE: 13px; BACKGROUND-IMAGE: url(YaBBImages/catbg.jpg); COLOR: #000000
}
.bordercolor {
   FONT-SIZE: 12px; FONT-FAMILY: Verdana, arial, helvetica, serif; BACKGROUND-COLOR: #6394bd
}
.quote {
   FONT-SIZE: 10px; COLOR: #000000; FONT-FAMILY: Arial, verdana, helvetica, serif; BACKGROUND-COLOR: #dee7ef
}
.code {
   FONT-SIZE: 10px; COLOR: #000000; FONT-FAMILY: Courier New, helvetica, Times New Roman, serif; BACKGROUND-COLOR: #cccccc
}
.help {
   CURSOR: help; BACKGROUND-COLOR: transparent
}
.meaction {
   COLOR: red; BACKGROUND-COLOR: transparent
}
.editor {
   width : 100%
}
</STYLE>
------------------------
where shall i place my code:
 @font-face {
 font-family: MyFontName;
 font-style:  normal;
 font-weight: normal;
 src: url(http://www.mysite.org/fonts/myfont.eot);
---------------------
so i need some one to figure out this small problem..

[andrea]

You have to put your font at least into the classes (case you want your font on the whole page)
- body
- windowbg
- windowbg2
- title1
- catbg

There might be more, depends on your template.