Jump to content

Css Link Problem

kitcowan

By kitcowan
in CSS

Recommended Posts

kitcowan Newbie

kitcowan

Posted
Posted

Hi Folks, I've been building websites for nonprofits and friends for a few years and still have never successfully linked my indexes to the external css page. I'm usually in a rush and so I just put the css into the index to get done. But I need to know this detail - here's my latest project. It's just something I'm going to show some one, to convince them they need a web page and it's raw, but take a look: first is the css page, then is the index.<html><head>body,div {margin: 0; padding: 0px}#nav {float: left; width: 100px; border: none; padding: 1em}#ads {float: right; width: 100px; border: none; padding: 1em}#txt {margin-left: 550px; margin-right: 250pxtext-color: black; text-align: left; padding: 3px}#ftr {clear: both}#hdr {background: #ffffcc; text-align: center}#ftr {background: clear}#nav {background: clear}#txt {background: yellow}.a:visited {color: black; text-color: yellow}.ext {padding: 4px; border:1px solid black; margin: 4px;background: yellow}h1 {font-family: arial; color:#006600; }h2 {font-family:Garamond,"Times New Roman",serif;color: black}h3 {font-family:"Times New Roman"; color:#3399cc}h3 > span {background: #ffcc33; border-style: solid}</head><body><div id="hdr"><h1>The Health Connection</h1></div><div id="nav"><br><br><a class="ext" href="activities.html">Acitivites</a><br><br><br><br><a class="ext" href="mission.html">Our Mission</a><br><br><br><br><a class="ext" href="deb.html">Nutritionist Deb</a><br><br><br><a class="ext" href="evaluation.html">Evaluation Form</a><br><br><br><br><a class="ext" href="consult.html">Consultation</a><br><br><br><br><a class="ext" href="continue.html">Continuing Care</a><br><br><br><a class="ext" href="wrap.html">Wrapping Up</a><br><br><br><br><a class="ext" href="faq.html">FAQ</a></div></body></html>----------------------------------------------------<html><head><title>The Health Connection</title><style type="text/css"> or should I say: <link rel="stylesheet" type="text/css" @import url(deblink.css) href="basic.css" media="all"> NEITHER WORKED!</style></head><body><div id="ads"><a class="ext" href="mission.html">Our Mission</a><br><br><br><br><a class="ext" href="deb.html">Nutritionist Deb</a><br><br><br><a class="ext" href="evaluation.html">Evaluation Form</a><br><br><br><br><a class="ext" href="consult.html">Consultation</a><br><br><br><br><a class="ext" href="continue.html">Continuing Care</a><br><br><br><a class="ext" href="wrap.html">Wrapping Up</a><br><br><br><br><a class="ext" href="faq.html">FAQ</a></div><div id="txt"><h2 align="center">Welcome to the The Health Connection.</h2><p>We have been in existence since since 1932 and serve the greaterHudson Valley.</p> <p>Or</p><p>Are you looking for the answers to why your body just isn'tlike it used to be? Do you ache all the time? Do you have problems sleeping at night - find it difficult to lose weight? Have you tried everythingand still don't feel right?</p><p>We are the folds for you. Please scan this website thoroughly; read our mission, read the testimonials, fill out the evaluation form and find outwhat issues your body has, and then decide for yourself if you thinkwe can help you. We know that you will be quite pleased with the health we can help you find.</p> </div></body></html>I appreciate your help! --Kit

Link to comment
Share on other sites
bigsilk Member

bigsilk

Posted
Posted

Try this:<link href="CSS/default.css" rel="stylesheet" type="text/css" />where your directory structure looks something like this:index.htmlotherpage.htmlotherpage2.html(folder:CSS)<--this is where you put your CSS-->(folder:images)<--this is where you put your images-->Also, in your second <p>, you put 'We are the folds for you.'

Link to comment
Share on other sites
kitcowan Newbie

kitcowan

Posted
  • Author
Posted

Thanks!! :-)

Try this:<link href="CSS/default.css" rel="stylesheet" type="text/css" />where your directory structure looks something like this:index.htmlotherpage.htmlotherpage2.html(folder:CSS)<--this is where you put your CSS-->(folder:images)<--this is where you put your images-->Also, in your second <p>, you put 'We are the folds for you.'
Link to comment
Share on other sites
Ingolme w3schools Guru

Ingolme

Posted
Posted

You don't put HTML in a CSS page. If the first set of code you provided is what's in your CSS file, then it's wrong.The only part you can put in a CSS file is this:

body,div {margin: 0; padding: 0px}#nav {float: left; width: 100px; border: none; padding: 1em}#ads {float: right; width: 100px; border: none; padding: 1em}#txt {margin-left: 550px; margin-right: 250pxtext-color: black;text-align: left;padding: 3px}#ftr {clear: both}#hdr {background: #ffffcc; text-align: center}#ftr {background: clear}#nav {background: clear}#txt {background: yellow}.a:visited {color: black; text-color: yellow}.ext {padding: 4px; border:1px solid black; margin: 4px;background: yellow}h1 {font-family: arial; color:#006600; }h2 {font-family:Garamond,"Times New Roman",serif;color: black}h3 {font-family:"Times New Roman"; color:#3399cc}h3 > span {background: #ffcc33; border-style: solid}

The two ways to add a stylesheet are the following:

<style type="text/css"> @import url(basic.css) </style>

and

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

Link to comment
Share on other sites
Jerry62704 Member

Jerry62704

Posted
Posted 
*** no HTML in this file ***body,div {margin: 0; padding: 0px}#nav {float: left; width: 100px; border: none; padding: 1em}#ads {float: right; width: 100px; border: none; padding: 1em}#txt {margin-left: 550px; margin-right: 250px	text-color: black;	text-align: left;	padding: 3px}#ftr {clear: both}#hdr {background: #ffffcc; text-align: center}#ftr {background: clear}#nav {background: clear}#txt {background: yellow}.a:visited {color: black; text-color: yellow}.ext {padding: 4px; border:1px solid black; margin: 4px;	background: yellow}h1 {font-family: arial; color:#006600; }h2 {font-family:Garamond,"Times New Roman",serif;color: black}h3 {font-family:"Times New Roman"; color:#3399cc}h3 > span {background: #ffcc33; border-style: solid}*** no HTML in this file

next file...----------------------------------------------------

*** you need a DOCTYPE here ***<html><head><title>The Health Connection</title><style type="text/css"> [..or should I say:..]<link rel="stylesheet" type="text/css">[depends on if you want to include the style here or in the external sheet][add the "href=your.css" to that tag of course]@import url(deblink.css) href="basic.css" media="all"> [..NEITHER WORKED!..][because the syntax was wrong.]<style type="text/css">@import url(your.css);</style>[or]<link rel="stylesheet" type="text/css" href="your.css" /></head><body><div id="ads"><a class="ext" href="mission.html">Our Mission</a><br><br><br><br><a class="ext" href="deb.html">Nutritionist Deb</a><br><br><br><a class="ext" href="evaluation.html">Evaluation Form</a><br><br><br><br><a class="ext" href="consult.html">Consultation</a><br><br><br><br><a class="ext" href="continue.html">Continuing Care</a><br><br><br><a class="ext" href="wrap.html">Wrapping Up</a><br><br><br><br><a class="ext" href="faq.html">FAQ</a></div>[the above is a list.  use ul and li styled of course]<div id="txt"><h2 align="center">Welcome to the The Health Connection.</h2><p>We have been in existence since since 1932 and serve the greaterHudson Valley.</p><p>Or</p><p>Are you looking for the answers to why your body just isn'tlike it used to be? Do you ache all the time? Do you have problemssleeping at night - find it difficult to lose weight? Have you tried everythingand still don't feel right?</p><p>We are the folds for you. Please scan this website thoroughly; read ourmission, read the testimonials, fill out the evaluation form and find outwhat issues your body has, and then decide for yourself if you thinkwe can help you. We know that you will be quite pleased with the healthwe can help you find.</p></div></body>

I can get more specific if you want...

Link to comment
Share on other sites
thescientist w3schools Guru

thescientist

Posted
Posted

so does it not work? the commenting within your HTML page is kind of confusing. You should just put your code in the code box with commenting appropriate for HTML/CSS documents, and add your thoughts questions outside the codebox.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...