External CSS isn't Loading in Browser - HTML Forums

DReality · 02-01-2012, 03:01 PM

Hey, I'm new to the forum and glad to be here. I started learning XHTML and CSS 4 weeks ago. They are my first markup languages and I've found using them to be a little challenging. I'm building my first website and whenever I apply external CSS, my browser quits showing it. My code becomes normal HTML.

If I use internal CSS, my browser shows it. I'm having a similar problem with loading images off of my hard drive rather than the web. Can someone help please

Pegasus · 02-01-2012, 03:18 PM

We'd need to see the code you're using. Can we get a link to the page(s) that don't work or, failing that, post your code here, inside [html] tags.

Drew · 02-01-2012, 04:44 PM

Check "View" In your browser, make sure styles > page styles is enabled, else wise, make sure your code to import the style sheet is correct, it should look something like

Code:

<link href="directory" rel="stylesheet" type="text/css" media="all" />

DReality · 02-04-2012, 03:25 AM

I'm using Windows if that matters. And here's the code, its still not showing up.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Basic//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>
<meta http-equiv="Content-Type" content="text/html"; charset=ISO-8859-1">

<title> Home | Deciphering Reality </title>

<link href="Documents/webcss.css" rel="stylesheet" type="text/css" media="all" />

</head>

<body>

<p>
This is my first website. Check out my background.

</p>

</body>

</html>

Then the css I'm using currently is:

body {
font-family: helvetica, arial, sans-serif;
font-size: 14px;
margin: 0px;
padding: 0px;
background-image:url("http://i1152.photobucket.com/albums/p482/DecipheringReality/Website-Background-1.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}

Pegasus · 02-04-2012, 06:41 AM

Part of your problem is that your image is 158kb. Try this one.

DReality · 02-04-2012, 07:12 PM

Quote:

Originally Posted by Pegasus

Part of your problem is that your image is 158kb. Try this one.

I didn't realize it was that big, thank you!

And unfortunately I still can't get the image or my other css to load. I'm wondering if it could be my computer... about two weeks ago I could load external css. I'm not sure why it won't anymore but this is a big problem considering the building of my website depends on this. (damn technology lol)

Pegasus · 02-04-2012, 08:23 PM

Okay, correct me if I'm wrong, but your .css file is in the folder "Documents" on your computer and the background-image is hosted in Photobucket. What happens when you put the image in the same general location as the .css file? Either both on your computer or both hosted elsewhere.

Another option might be to add a width and height value to your CSS for the body tag. Just to see what happens. Sometimes, if a height and width isn't specified, a background-image won't show up because there's not enough space to show the image. Just a thought, anyway.

SpAm · 02-05-2012, 03:29 AM

Hi DReality

Firstly, have you cleared your cache? The page may be working fine, but if your browser is loading from cache then you may get the wrong version.

Secondly, is the path correct for your CSS file. As peg mentioned, the path you have specified is a relative one, stating that the CSS file is in a folder called 'Documents', but also that this 'Documents' folder is in the same directory as the HTML file.

If it is not, could you tell us where the HTML file is, and where the CSS file is (file paths I mean). Then we can give you accurate relative paths.

DReality · 02-05-2012, 06:18 PM

Quote:

Originally Posted by SpAm

Hi DReality

Firstly, have you cleared your cache? The page may be working fine, but if your browser is loading from cache then you may get the wrong version.

Secondly, is the path correct for your CSS file. As peg mentioned, the path you have specified is a relative one, stating that the CSS file is in a folder called 'Documents', but also that this 'Documents' folder is in the same directory as the HTML file.

If it is not, could you tell us where the HTML file is, and where the CSS file is (file paths I mean). Then we can give you accurate relative paths.

You are amazing!! I cleared my cache and now my external css is loading. I had experimented with absolute links using a photobucket account so I could see how the layout was working. Now I'm going to use relative links again, keeping all my files in the documents folder together.

Again, thank you!

SpAm · 02-06-2012, 02:47 AM

Quote:

Originally Posted by DReality

You are amazing!! I cleared my cache and now my external css is loading. I had experimented with absolute links using a photobucket account so I could see how the layout was working. Now I'm going to use relative links again, keeping all my files in the documents folder together.

Again, thank you!

No problem

Glad I could could