Question

This problem doesn’t seem browser specific and generally applies to style in the webkit/gecko/mozilla styles.

For example, when I do a site mockup and use a style like:

element.class {
    border-radius: 5px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 1px solid #800000;
}

or

element:last-child {
    ....
}

When opening the file via double-clicking on it, the style renders as I would expect. However, when applying the style to a live site served by IIS7, the style seems to have been ignored. I’ve gone through the site’s IIS config and can’t seem to see why this would be.

Any help would be greatly appreciated.

Thanks!

Answer 1

That is probably not due to the web server. Here are a few things you could look for when troubleshooting:

1. Is the CSS-file loaded properly? Check the loaded resource in your browsers developer tools.
2. Could it be that you have a cached CSS-file that is loaded instead? Use the developer tools to check the CSS that is loaded and make sure that your CSS-rule is in there.
3. Is it possible that the live site has another CSS-rule with higher CSS-specificity that override your CSS-rule? Usually you can see this in developer tools as well, as the CSS-rule in that case has a strike-through or similar to indicate that it has been overwritten.