function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
badirbadir 

.htc files for styling

I'm working with an htc file to style my visualforce pages. The problem is that the .htc file needs to live on the server that the html pages are being served from. I am unable to reference this file, or figure a means to make it work. I tried using:

 

{!URLFOR($Resource.DomainCss, 'style/PIE.htc')}  - this doesn't work somehow. No paths or sheets are recognized using this method of getting resources, whether looking for .css, .js, or .htc files. ( Actually, the example for URLFOR doesn't seem to work either... )

 

So I wrote a line for each stylesheet:

 

{!$Resource.Master}, {!$Resource.Secondary}, {!$Resource.Typo}, etc. and all files are found and serve their purpose. 

 

But.. I cannot get the .htc file to be seen. ( This is IE only, btw. ) I am using PIE.htc and cannot find a way to include the file in a meaningful way. Has anyone else ever tried or seen this done?

 

Thanks much in advance.

 

b

MANATTWebMANATTWeb

Same issue - anyone doing this?
MANATTWebMANATTWeb

Hey - thought I'd reply as I've figured out how to get CSS3 working for IE. I use the .js version of CSSPie (CSS3Pie.com) and include it in a conditional statement for IE only at the top of the VF page and add the function at the bottom of the page. After you download the .js file and put it in your Static Resources, add this to the top of the VF page.

 

<apex:outputText escape="false" value="{!lt}!--[if lt IE 10]{!gt}"/>
    <style>.searchbox { top: 4px; width: 132px; }</style>
    <script type="text/javascript" src="{!URLFOR($Resource.%yourzipfile%, 'PIE.js')}"></script>
<apex:outputText escape="false" value="{!lt}![endif]--{!gt}"/>

 Then this at the bottom:

 

(function(){
    if (window.PIE) {
        $('.css3Box').each(function() { //add your css selector in this line.
            PIE.attach(this);
        });
    }
})();

 Finally, add this to the controller:

 

//helpers for IE conditional statements
public String getLt(){
    return '<';
}	
public String getGt(){
    return '>';
}
//end helpers

 Now you're ready to use the CSS3 elements listed on the PIE website and they will work in IE 7+.