I was successfully able to move internal CSS code into an external .css file just fine. I realized that no matter what I tried, it just wouldn't work unless it was in the same directory as the file I wanted. This isn't really an issue in this case, but I wanted to keep my site organized by moving all the .css files into one css directory. Like I said not really an issue with what I am looking at now, but when I get to the navigation menu which will be used by all pages, it may become an issue with multiple files in different directories being used.

Here is what I have that is working with the HTML and the CSS in the same root directory:


<!DOCTYPE html> 
        <title>DocTech25 Universe</title> 
        <link rel="stylesheet" type="text/css" href="docTech25Banner.css"> 


    background: url('resources/images/docTech25Banner.png') no-repeat center center fixed;  

    -webkit-background-size: cover; /* Safari & Chrome */
    -moz-background-size: cover; /* Firefox */
    -o-background-size: cover; /* Opera */
    background-size: cover; /* Internet Explorer? */


Here is my directory structure:

I have tried:

<link rel="stylesheet" type="text/css" href="resources/css/docTech25Banner.css"> 
<link rel="stylesheet" type="text/css" href="/resources/css/docTech25Banner.css"> 
<link rel="stylesheet" type="text/css" href="http://docTech25.net/resources/css/docTech25Banner.css">

The only thing that is working right now is if I have this:

<link rel="stylesheet" type="text/css" href="docTech25Banner.css">

This is contained in the same directory as the file. Any help would be greatly appreciated.

Just want to be confirm, is your html file is in the root directory?
If yes, then try
<link rel="stylesheet" type="text/css" href="./resources/css/docTech25Banner.css">

Yes, I just figured it out. I had to change the image in the css to be relative so instead of:

background: url('resources/images/docTech25Banner.png') no-repeat center center fixed; 

I am now using:

   background: url('../images/docTech25Banner.png') no-repeat center center fixed;  

Thanks for your help. Now onto trying to seperate the bootstrap code into its' own seperate file if possible.