function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Sanchai CRM-CSanchai CRM-C 

Cannot use Custom CSS file on VF page

Hi All

 

I have try to work on Force.com site.

 

I need to use custom stylesheet on the page. So I try to study by myself from http://www.salesforce.com/us/developer/docs/pages/Content/pages_styling_custom.htm

 

I have some problem that I cannot use custom css file on my page.

 

Below this is my VF page code.

 

 

<apex:page showHeader="false" standardStylesheets="false">
	<apex:stylesheet value="{!$Resource.customCSS}" />

	<h1>Testing Custom Stylesheets</h1>

	<p>This text could go on forever...<BR /><BR />But it won't!</p>

	<apex:outputLink value="https://www.salesforce.com" styleClass="newLink">
		Click here to switch to www.salesforce.com
	</apex:outputLink>

</apex:page>

 And customCSS file is : 

 

h1 { color: #FF0000; }

p { background-color: #EEEECC; }

newLink { color: #FF6600; font-weight: bold;}

 for the result http://crmmarket-developer-edition.na7.force.com/index

 

 

the code result is :

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
 
 
	<html><head><script src="/index/jslibrary/1296001444000/JiffyStubs.js" type="text/javascript"></script><link class="user" href="/index/resource/1299612283000/customCSS" rel="stylesheet" type="text/css" /></head><h1>Testing Custom Stylesheets</h1> 
 
	<p>This text could go on forever...<BR /><BR />But it won't!</p><a href="https://www.salesforce.com" class="newLink"> 
		Click here to switch to www.salesforce.com</a></html>

 

 

I think h1 should show the text in the red but it dose not.

 

Please advise me that what I am wrong?

 

Best Answer chosen by Admin (Salesforce Developers) 
dfiredfire

Did you  upload the css using Internet Explorer? If so, I think it doesn't save as mime type text/css rather some sort of funky MS format. Firefox and Chrome will upload as text/css

 

Also try something like this 

 

 

<apex:stylesheet value="{!URLFOR($Resource.customCSS)}" />

All Answers

dfiredfire

Did you  upload the css using Internet Explorer? If so, I think it doesn't save as mime type text/css rather some sort of funky MS format. Firefox and Chrome will upload as text/css

 

Also try something like this 

 

 

<apex:stylesheet value="{!URLFOR($Resource.customCSS)}" />
This was selected as the best answer
Sanchai CRM-CSanchai CRM-C

Thank you very much dfire

 

For old mime type was "text/pain". I fixed by upload again using Chrome.