View Full Version : CSS file only loads in some browsers

Nov 12th, 2009, 11:17 AM
I'm working on creating my own website, the problem is that the css stylesheet only loads my website perfectly in Google Chrome, and Safari browsers. When I cross check against Firefox, IE, or Opera, the stylesheet doesn't load at all, only the basic index.html file that I created if the stylesheet doesn't load shows up.

I've been searching forums and websites for hours trying to figure out the problem from other people with the similar issue, and nothing has worked for me. Here's everything I've tried and none have worked:

1. Renaming the .css
2. Putting the index, css, and image files in ALL public locations on the server
3. Completely deleting all files, and the add-on domain and adding it again
4. Changing the file codes from uni-8, ascii, etc.
5. Checking both the index and css to make sure they're valid, which they are.
6. Clearing all browser history, cache, and temp files.
7. Adding
<Files *.css
AddType exp=*.css type=text/css
</Files to a .nsconfig file
8. Adding
AddType text/css .css to .htcaccess
9. Creating a directory in my main domain and linking to that in the stylesheet, then tried creating a directory in my add-on domain and linking to that
10. Using full path names to link to in the stylesheet
11. Checked that when the .css is viewed in the browser it's a text/css and not text/html
12. Checked with Firebug for errors and it says
Failed to load source for: http://www.daphnelink.com/stylesheet.css But I can visit the file fine, even after renaming...so, I'm not sure what to do with this error.

I should also mention that the domain is an add-on domain on justhost servers, so it's like a subdomain, since I have another main domain (hopefully this makes sense).

Example: I already have www.mysiteOne.com, but I needed hosting for mysiteTwo.com, so I pointed the nameservers to mysiteTwo.com as well, to use the hosting on justhost, and created mysiteTwo.com as an add-on under mysiteOne.com. mysiteTwo.com can be visited normally as mysiteTwo.com, instead of a regular subdomain like mysiteTwo.mysiteOne.com.

Anyway, I also found that some people say this could be a problem with my server, (Apache on justhost in my case). If so, how do I fix this? Do I need to email justhost, and if so, what do I need to tell them in particular to fix the problem?

Lastly, I should also mention that I had a different css and index file last week and everything loaded fine, and when I created this new css and index file for a different layout this week, I got this issue. So, this problem wasn't happening last week.

Thanks in advance for anyone that can help me & apologies for the length, but I tried to be as detailed as possible.

Site (http://www.daphnelink.com)
CSS File (http://www.daphnelink.com/stylesheet.css)

I'll edit this post to add the code if needed; like I mentioned it's all been validated against w3.

Nov 12th, 2009, 11:55 AM
Never encounter such problem ...

The only method we use to add a .css file to a code is

<link href=".css FILE WORKING PATH" rel="stylesheet" type="text/css" />

The only thing that we ensure is the path of the .css is correct and the code inside the .css file is validated by w3c

Nov 12th, 2009, 12:01 PM
Try this code.

It worked for me on IE7 and Firefox.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<link href="http://www.daphnelink.com/stylesheet.css" rel="stylesheet" type="text/css" />


<!-- start wrapper -->
<div class="wrapper">

<!-- start headerbg -->
<div id="headerBg">

<!-- start header -->
<div id="header">
<h1>Daphne Link</h1>

<!-- start slogan -->
<div id="slogan">
<p>Development &amp; Design</p>
</div> <!-- end slogan -->

</div> <!-- end header -->
</div> <!-- end headerbg -->

<!-- start navigation -->
<div id="nav">
<ul id="styleNav">
<li><a href="http://www.daphnelink.com/">Home</a></li>
<li><a href="http://www.daphnelink.com/portfolio.html">Portfolio</a></li>

<li><a href="http://www.daphnelink.com/about.html">About</a></li>
<li><a href="http://www.daphnelink.com/contact.html">Contact</a></li>
<!-- end navigation -->

<!-- start content -->
<div id="content">
<p>My name is Daphne Link, and I develop and design websites and video games.</p>

<!-- end content -->

<!-- start footer -->
<div id="footer">
<p>Copyright &copy; 2009 <a href="http://www.daphnelink.com">Daphne Link</a></p>
<!-- end footer -->

<!-- end wrapper -->
<!-- end body -->

Nov 12th, 2009, 12:03 PM
Hi there,

I would like to help, but I think I need to see the code - can you post an example, or the URL?


Nov 12th, 2009, 12:04 PM
<link rel="stylesheet" type="type/css" href="stylesheet.css" media="screen" />It should be text/css :)

Nov 12th, 2009, 12:11 PM
Haha... I just realised there are links to the code all over your post... haha - sorry!!

Good call abduraooft!

Nov 13th, 2009, 03:52 AM
It should be text/css :)

Oh wow! Why didn't the w3 validator catch that I wonder? Thanks...that fixed it. So simple.

Also technia, your code worked too changing from strict to transitional.