Jump to content

Html doesn't link to css sheet?


eduard
 Share

Recommended Posts

Why doesn't my html document link to my external css style sheet? <!DOCTYPE html> <html> <head><link rel="stylesheet" type="text/css" href="ex1.css"><title>Eduard Lid</title></head> <body> <div id="container"><p id="name">Eduard Lid</p><ul id="flags"> <li><a href="#">us<span id="amer"></span></a></li> <li><a href="#">es<span id="spanish"></span></a></li> </ul></div> <div id="main"><ul id="links"> <li><a href="american.html">more</a></li> <li><a href="spanish.html">más</a></li> </ul> </div> <div id="bottom"> <p id="design">web<br>design diseñar<span id="copyright">Copyright © 2013</span></p> <a href="http://ar.linkedin.com/in/eduardlid"> <img id="rot" src="http://www.linkedin.com/img/webpromo/btn_viewmy_120x33_es_ES.png?locale=" alt="Ver el perfil de Eduard Lid en LinkedIn"></img>* Rotate div */ </a> </div> </body></html> * { margin:0; padding:0; list-style-type:none; }body{ font: bold 15px arial,geneva,SunSans-Regular,sans-serif; background-color:#000000; } #container{ clear:both; position:relative; background-color:#000000; width:100%; height:120px; } #name{ font-size:50px; color:#7fff00; text-align:center;} #main { clear:both; position:relative; height:280px; background-color:#000000; border:4px solid #808080; } #bottom {background-color:#000000;height:80px;} links { float:left; padding:10px 0 0 100px; font-size:12px; }#links li { margin-bottom:5px; } #links a { color:#ffffff; } #links a:hover { color:#696969; }#flags { float:right; width:256px; height:20px; margin:10px 0px; } #flags li { position:relative; float:left; width:24px; margin:0 2px; font-size:8%; font-weight:normal; } #flags a,#flags span { position:relative; display:block; width:20px; line-height:2px; font-size:0%; font-weight:normal; } #flags span { position:absolute; top:0; left:0; width:-6px; height:24px; background-position:0 -2px; } #flags span:hover { box-shadow:#eef 0 0 0px; } #amer { background-image:url(americanflag.gif); } #spanish { background-image:url(spanishflag.gif);} #design { position:relative; font-size:50px; color:#7fff00; text-align:center; }#copyright { position:absolute; top:40px; right:100px; font-size:10px; color:#fff; } #rot {transform:rotate(-30deg);-ms-transform:rotate(-30deg); /* IE 9 */-moz-transform:rotate(-30deg); /* Firefox */-webkit-transform:rotate(-30deg); /* Safari and Chrome */-o-transform:rotate(-30deg); /* Opera */}

Link to comment
Share on other sites

what did you do try and solves the problem? Double check your path? spelling? casing? you can open up your error console in your browser and any broken links should appear there. compare that path to the location where the actual file is.

Edited by thescientist
Link to comment
Share on other sites

what did you do try and solves the problem? Double check your path? spelling? casing? you can open up your error console in your browser and any broken links should appear there. compare that path to the location where the actual file is.
What did I do? I copied the html code and pasted it into the validator, corrected the codes and copied the improved version and pasted it into my css file!Since then I have this problem!
Link to comment
Share on other sites

What did I do? I copied the html code and pasted it into the validator, corrected the codes and copied the improved version and pasted it into my css file!Since then I have this problem!
that tells me what you did. what I asked was, and what you should be doing, is steps that you are taking to fix it. why is your HTML going into your CSS? why aren't you validating your CSS? why aren't you looking in the error console for broken paths? why didn't you check spelling, casing, location fo the CSS file? there are so many things you can do to actually DEBUG your problems, not just throw your hands up when you get them and run here to ask us with no attempt on your own to have done anything about it.
Link to comment
Share on other sites

that tells me what you did. what I asked was, and what you should be doing, is steps that you are taking to fix it. why is your HTML going into your CSS? why aren't you validating your CSS? why aren't you looking in the error console for broken paths? why didn't you check spelling, casing, location fo the CSS file? there are so many things you can do to actually DEBUG your problems, not just throw your hands up when you get them and run here to ask us with no attempt on your own to have done anything about it.
Haven't done anything about it??? (3 hours) (I always try myself first, because I hate to wait!)
Link to comment
Share on other sites

if you in fact did something for 3 hours, why not tell us? Better to know what you've tried so we don't have to cover the same ground on our own time. So, then what did you do for 3 hours? What can we eliminate from the list of possible causes?

Edited by thescientist
Link to comment
Share on other sites

  • 2 weeks later...

for what i can see on your code, the referece of the css code must be on the root folder or in the same folder the html is to work. Its better to make them independen files, like one for html file (index.html) and one css file (default.css). Then for example,on the index file you just put this code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><link href="default.css" rel="stylesheet" type="text/css" media="all" /> < --! Assuming you have the css file on the same foolder --></head><body><div id="wrapper"><div id="header">  <div id="logo"><--! and so on...... -->

Link to comment
Share on other sites

for what i can see on your code, the referece of the css code must be on the root folder or in the same folder the html is to work. Its better to make them independen files, like one for html file (index.html) and one css file (default.css). Then for example,on the index file you just put this code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><link href="default.css" rel="stylesheet" type="text/css" media="all" /> < --! Assuming you have the css file on the same foolder --></head><body><div id="wrapper"><div id="header">  <div id="logo"> <--! and so on...... -->

That's exactly what he has?Just make sure your file is name ex1.css exactly! Caps and all. Then make sure your two files (.html and .css) are in the same folder...Just do what you do with all your other sites.
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...