Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

Compile 'em all

macrumors 601
Original poster
Apr 6, 2005
4,130
323
I am completely stumped as to why this doesn't work. It seems the HTML file can't load the CSS for some reason, even though both are in the same directory.Any idea what might be the problem?

index.html
Code:
<!DOCTYPE html>
<html>
    <head>
        <title>Home Page</title>
      
     <link rel="stylesheet" href="style.css" media="screen" />
     		<meta name="viewport" content="width=1100">    
    </head>
    <body>
        <div id="main">
            Hello
        </div>
    </body>
</html>

and style.css which is in the same directory

Code:
body{
    background-color: #F9F9F9;
	background-image: url(images/bg3.png);
	background-position: center top;
	background-repeat: repeat;
    text-shadow: #FFFFFF 0px 1px 0px;
	font-family: "Georgia", "Times", serif;
	-webkit-font-smoothing: antialiased;
}

a{
    text-decoration: none;
}

#main{
    margin: 50px auto 50px auto;
    width: 1000px;
    min-height: 500px;
    padding: 0px 20px 0px 20px;
}

however, this works

Code:
 <!DOCTYPE html>
<html>
    <head>
        <title>Homepage</title>
      

  
  
  <style type="text/css" media="screen">
  
  
  body{
    background-color: #F9F9F9;
	background-image: url(images/bg3.png);
	background-position: center top;
	background-repeat: repeat;
    text-shadow: #FFFFFF 0px 1px 0px;
	font-family: "Georgia", "Times", serif;
	-webkit-font-smoothing: antialiased;
}

a{
    text-decoration: none;
}

#main{
    margin: 50px auto 50px auto;
    width: 1000px;
    min-height: 500px;
    padding: 0px 20px 0px 20px;
}

</style>
     		<meta name="viewport" content="width=1100">    
    </head>
    <body>
        <div id="main">
       Hello
        </div>
    </body>
</html>
 

Compile 'em all

macrumors 601
Original poster
Apr 6, 2005
4,130
323
Nope. style.css. I even changed the name just to to make sure, and nothing. Same problem.
 

Darth.Titan

macrumors 68030
Oct 31, 2007
2,905
753
Austin, TX
My external stylesheet declarations have one more attribute than yours:

<link rel="stylesheet" href="style.css" media="screen" type="text/css" />

I'm not sure that will make a difference, it was just a thought.
 

karl878

macrumors member
Dec 8, 2005
79
0
CA
My first step in figuring out why HTML/CSS code is not working as I expected, is to run the code through a validator. The validator I use the most is the W3C Markup Validation Service.

http://validator.w3.org/

There is a link on the above page to also validate CSS stylesheets.
 

adamtehbadam

macrumors newbie
Jan 10, 2008
12
0
Have you tried running your CSS through a validator? Perhaps you left a bracket or semicolon off somewhere...

What about shift-refreshing the page or clearing the cache?
 

elppa

macrumors 68040
Nov 26, 2003
3,233
151
I'm going with MasConejos idea – permissions.

Open the page in Safari, open the webkit inspector, go to the network tab and then see what it says for "style.css".

If it's a 404 and it is in the same directory, then it will more than likely be permissions.

How you are accessing index.html:
[1] file://
[2] localhost?
[3] remote server?

Hope that make sense? I was being brief because I am lazy, but I am happy to provide a more in depth explanation of the above if required.
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.