hi All,

Can anybody tell us how to make IE specific CSS in the Salesforce environment.

We have tried: conditional comments for IE in the knowledgeHeader.componentf ile, but the CSS does get parsed to the page. It seems to end up just as a comment.

<apex:outputPanel id="ieCSS" layout="block">

  <!--[if IE]>

     <style type='text/css'>

         [id*=header-refresh] { position:absolute; top:21px; left:21px;}

     </style>

  <![endif]-->

</apex:outputPanel>

We want to use a custom font for our Support page nav bar button text - Trade Gothic.

Here is how we intend to implement. Is this correct before we expend resources to implement.

1. load the font files in the /staticpkg/staticresources/ folder.

2. load a separate .resource file with a corresponding .xml for each font file type, and code the files in the same manner as images are loaded in this folder

3. Edit the  CSS file that is included in our "knowledgeLayout.page" file to include the font embed CSS and point the path for each font file to the static resource folder where they live, as follows:

@font-face {
    font-family: 'TradeGothic';
    src: url('/support/resource/1294100226000/tradegot-webfont.eot');
    src: url('/support/resource/1294100226000/tradegot-webfont.eot?#iefix') format('embedded-opentype'),
         url('/support/resource/1294100226000/tradegot-webfont.woff') format('woff'),
         url('/support/resource/1294100226000/tradegot-webfont.ttf') format('truetype'),
         url('/support/resource/1294100226000/tradegot-webfont.svg#TradeGothicMedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TradeGothic';
    src: url('/support/resource/1294100226000/tradegotboltwo-webfont.eot');
    src: url('/support/resource/1294100226000/tradegotboltwo-webfont.eot?#iefix') format('embedded-opentype'),
         url('/support/resource/1294100226000/tradegotboltwo-webfont.woff') format('woff'),
         url('/support/resource/1294100226000/tradegotboltwo-webfont.ttf') format('truetype'),
         url('/support/resource/1294100226000/tradegotboltwo-webfont.svg#TradeGothicBoldTwo') format('svg');
    font-weight: bold;
    font-style: normal;

}

4. add the "TradeGothic" attribute to ous nav button text CSS.

Done.

hi All,

Can anybody tell us how to make IE specific CSS in the Salesforce environment.

We have tried: conditional comments for IE in the knowledgeHeader.componentf ile, but the CSS does get parsed to the page. It seems to end up just as a comment.

<apex:outputPanel id="ieCSS" layout="block">

  <!--[if IE]>

     <style type='text/css'>

         [id*=header-refresh] { position:absolute; top:21px; left:21px;}

     </style>

  <![endif]-->

</apex:outputPanel>

We want to use a custom font for our Support page nav bar button text - Trade Gothic.

Here is how we intend to implement. Is this correct before we expend resources to implement.

1. load the font files in the /staticpkg/staticresources/ folder.

2. load a separate .resource file with a corresponding .xml for each font file type, and code the files in the same manner as images are loaded in this folder

3. Edit the  CSS file that is included in our "knowledgeLayout.page" file to include the font embed CSS and point the path for each font file to the static resource folder where they live, as follows:

@font-face {
    font-family: 'TradeGothic';
    src: url('/support/resource/1294100226000/tradegot-webfont.eot');
    src: url('/support/resource/1294100226000/tradegot-webfont.eot?#iefix') format('embedded-opentype'),
         url('/support/resource/1294100226000/tradegot-webfont.woff') format('woff'),
         url('/support/resource/1294100226000/tradegot-webfont.ttf') format('truetype'),
         url('/support/resource/1294100226000/tradegot-webfont.svg#TradeGothicMedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TradeGothic';
    src: url('/support/resource/1294100226000/tradegotboltwo-webfont.eot');
    src: url('/support/resource/1294100226000/tradegotboltwo-webfont.eot?#iefix') format('embedded-opentype'),
         url('/support/resource/1294100226000/tradegotboltwo-webfont.woff') format('woff'),
         url('/support/resource/1294100226000/tradegotboltwo-webfont.ttf') format('truetype'),
         url('/support/resource/1294100226000/tradegotboltwo-webfont.svg#TradeGothicBoldTwo') format('svg');
    font-weight: bold;
    font-style: normal;

}

4. add the "TradeGothic" attribute to ous nav button text CSS.

Done.

Good evening everybody,

i have a problem with my Visual Force Page.

I will use an CSS File and Custom FONTS which is included via "Static Resource". 

All Fonts are also included as a Static Resource.

But how i can implement my custom fonts on a Visual Force Page?

Txs. for any information

Cheers