I am using php to generate the css files on the fly. But there is a weird outcome. When the page loads, CSS is not applied to any of the elements, though I can view the css code with Chrome developer tools and it looks all correct. And even weirder is that when I edit the code in developer tools panel (like adding a single no-effect white-space), suddenly the css takes effect! I tried clearing cache, no use. Do you have any idea what's wrong?
If it matters:
I am using symfony2.
CSS codes are on a separate file.
I can suggest few things: first: have you wrapped the css styles in the <style></style>
tag pair? If the generated css is in a file, are you linking it correctly like:
<link rel="stylesheet" type="text/css" href="yourpage.php">
Adding the charset can help you solving the issue: just add it at the very top of your file.
@charset "UTF-8";
this is useful if your style sheet has not only ASCII chars, so make the browser able to read the file correctly. You can read about this in here: http://www.w3.org/International/questions/qa-css-charset.en.php#atcharset and http://www.w3.org/TR/CSS2/syndata.html#charset
Ok guys. Thank you all. The problem was not the CSS itself. I had not set the content type header to text/css
, so I think it defaulted to text/html
. Setting the right header fixed the issue.