All,
I have a PHP MVC application with the following structure:
helloworld
- application
- configs
- controllers
- models
- layouts
- include
- library
- public
- .htaccess
- index.php
- design
- css
- style.css
- struct.css
- js
- images
- bg.gif
I have configured a virtual host in apache called hello
that points to helloworld/public/
folder. So, when I view my site, using http://hello
all the CSS and images render fine.
I deployed my site to a different server with similar config as above. When I access the website using http://test.com/hello
the CSS and the background images contained in it, renders absolutely fine in Chrome and Safari, but background images fail on IE,Firefox and Opera. When the page refreshes on these browsers, it works just fine. I am unable to understand the behavior for this.
The URLs in my CSS are written like this:
background-image: url(/design/images/bg.gif);
and my htaccess is like this:
Options -MultiViews -Indexes
#####################################################
# CONFIGURE media caching
#
Header unset ETag
FileETag None
Header unset Last-Modified
Header set Expires "Fri, 21 Dec 2012 00:00:00 GMT"
Header set Cache-Control "max-age=7200, must-revalidate"
SetOutputFilter DEFLATE
#
#####################################################
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^.*$ index.php [NC,L]
Can somebody explain why Background images and CSS is not rendering properly on page load, but renders after a page refresh?
let do some testing to identify the problem
1- try to access http://test.com/hello/design/images/bg.gif ,it should be accessible , if not then its permission problem
2- then try to use absolute url in your css files like background-image: url(http://test.com/hello/design/images/bg.gif);
3- if you still face the problem then its design issue , i guess you are using IE 6 check out here
Try to uncomment deflate option on your .htaccess, perhaps your server don't have mod_deflate activated.
#SetOutputFilter DEFLATE