Problem
Theme is not showing properly on my production server for individuals using Internet Explorer & Firefox after setting the CSS & JS Optimization options to enabled. I initially thought the theme was broken for IE, however upon further review I realize the reason IE didn't work while CSS/JS optimization was disabled is because of Internet Explorer not handling more than 31 CSS files.
To Help with troubleshooting I used the Site Documentation module to get all the info on the site, modules, etc. Here is the link to it.
Drupal Core: 6.22
Theme: 0 Point, Zen, Tao, PixtureReloaded
- It is not a multi-site installation
- It is on the same web hosting account as 3 other drupal installations, the 3 other drupal installs do not exhibit the same issue.
I used the Backup & Migrate module to copy the MySQL DB and used FileZilla to download the site/default/files/* folder(s) & files, site/all/modules, libraries, & themes files. I restored the DB & sites/default/files folder to a test server. Setting "Optimize CSS & JS" to enabled fixes the 31 css files problem for Internet Explorer and both FireFox and Internet Explorer are able to view the website theme as normal.
The absolute strange quandry here, is when I enable CSS/JS Optimization on the production server it breaks the theme for both IE and FireFox. Chrome and mobile devices (android & iPhone) are unaffected. I have not checked any other web browsers for issues.
I have listed the themes that I have specifically checked. Where do I continue troubleshooting this from here? I thought maybe changing the theme would fix it, however it has not.
Troubleshooting
Enabled the Optimize CSS/JS Files options by
- Making setting the File System >> Public option.
- Setting the Performance >> Optimize CSS/JS options to enabled.
- Clearing the Cache and Rebuilding the Theme Registry.
Switched the Theme to PixtureReloaded (an adaptive theme) and repeated the steps above.
Switched to Zen and repeated the steps above.
Checked the file system permissions for sites/default/files to make sure there was read/write access and there is for owner/group/other
It seems that regardless of the theme I switch it to it does not fix the IE issue, and when I optimize the css/js files it breaks the website for FireFox users as well.
-- Edit 11/1/2011 1:30AM UTC --
As per suggested I re-encoded all the files in the theme from ANSI to UTF-8 without BOM.
Backed up the original theme folder, after taking the site offline
Uploaded via ftp the re-encoded theme
Ran update.php, cleared the caches, rebuilt the theme registry
Issue persists.
-- Edit 11/1/2011 4:57 PM UTC --
I also tried using the Garland, Mannilli, and Bluemarine themes with the same results (I tested this last night when I took the site offline).
-- Edit 11/1/2011 6:53 PM UTC --
I took the site offline, changed the settings to "Optimize CSS: Enabled"
Viewed Source for Chrome, FireFox, & IE9
I am able to click on the links for the CSS files and browse them, each css file is the same, and I did a DIFF/Compare of the tag content and except for a session ID that ubercart uses for the shopping cart each head section is the same.