PDA

View Full Version : CSS perplexity

whl626
09-07-2005, 23:38/11:38PM
<style type="text/css">

body
{ background:#FFFFFF;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
}

a{color:#0000FF;}
a:hover{color:#800080;}
#logo{padding:0px;margin:0px;}

#header {
margin: 0px;
padding: 0px;
height: 200px;
}

#center {
top: 200px;
left: 180px;
right: 100px;
}

#left {
position: absolute;
left: 5px;
top: 200px;
width: 170px;
}

#right {
position: absolute;
right: 5px;
top: 200px;
width: 90px;
}
</style>

I am trying to apply CSS to my site. But it ends up in a mess it seems, may I know what's wrong with this simply CSS ?

Shocking result : http://www.medical-explorer.com/testingCSS.php

Whereas what I want is http://www.medical-explorer.com/cancer.php ( This is using tables and I am thinking of switching to CSS )
qwerty
10-07-2005, 00:28/12:28AM
You're getting a server error on the call to the CSS at http://www.englishdaily626.com/cgi-bin/medical-explorer.css

I get a 500 response when I try to go directly to that file.
WebSavvy
10-07-2005, 00:37/12:37AM
Take the .css file out of the CGI-BIN and put it in a folder in root called /css/ and then call it to the page from the new folder location.

CGI-BIN will automatically try to treat files listed there as BINARY (.exe / modules ) because that is the purpose of that folder. It does not know how to treat other files.

CSS does not require to be executed so it needs to be in a folder that's chmod 755 and files therein are chmod 644.

After you move the file, it should work.

Also, you need to add the comment tags to the CSS file like this:

<style type="text/css">
<!--


//-->
</style>

The comment tags are important because it keeps a spider from treating that as text on the page when it is not.

Example, have a search in google for anything from someone's CSS file and you'll find that's the snippet Google has indexed as the description for that page due to malformed CSS files.
g1smd
10-07-2005, 05:20/05:20AM
This can be simplified:

body
{ background:#FFFFFF;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0; ....

to be:

body
{ background:#FFFFFF;
margin: 0; ....



If you defined margin and padding for <body> then you don't need to repeat it here:

#header {
margin: 0px;
padding: 0px;
height: 200px;
}

This becomes:

#header {
height: 200px;
}



Run the CSS through http://jigsaw.w3.org/css-validator/validator-uri and see what error message you get.
whl626
10-07-2005, 10:46/10:46AM
Thanks, it seems to work now. But there is one final problem. At the bottom of all pages, there is asking for exchanging link and disclaimer.

But the length of each page is different since it depends on the article displayed. How can I use CSS in this scenario ? Hope You understand what I am saying ?
whl626
10-07-2005, 21:17/09:17PM
OK, problem solved :) So stupid that I put the two lines of sentences outside the <div> </div> tags :D . Just put them inside within the <div id="center"> </div>. Everything looks fine now.
g1smd
10-07-2005, 21:24/09:24PM
What does the W3C CSS checker say?

Are there any errors or warnings at all?
whl626
10-07-2005, 21:27/09:27PM
Errors
URI : http://www.medical-explorer.com/css/medical-explorer.css
Line: 7
Parse error - Unrecognized : <style type="text/css"> <!-- body { background:#FFFFFF; margin: 10px; padding: 0px; }

??? What's wrong with that ?
qwerty
10-07-2005, 21:34/09:34PM
A style sheet doesn't need the <style type="text/css">. That goes in the page, where you're calling the style sheet.

The closing </style> tag should be removed as well.
whl626
10-07-2005, 21:48/09:48PM
Thanks, no warning at all now. First time trying to use CSS, really learned something :)