...

View Full Version : body tag not working in css



stevenmw
10-26-2009, 12:37 PM
Fo some reason my body tag won't work. Everything in the stylesheet works except the body piece.

Here is my html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="style.css">

<title>...</title>
</head>

<body>
<div class="page">
<div class="outline">
<div class="topbox">
</div>
</div>
<div class="outline2">
<div class="mainnav">
</div>
</div>
<div class="outline3">
<div class="secondnav">
</div>
</div>
</div>
</body>
</html>

Here is my css:

/* CSS Document */
<style type="text/css">

body {
font-family: Verdana, Helvetica, Arial, sans-serif;
background: #949ca9;
}

.page {
background-color: #FFFFFF;
border-top: #FFFFFF 0px solid;
border-left: #847f7b 1px solid;
border-right: #847f7b 1px solid;
width: 900px;
height: 700px;
margin-top: 0px;
padding-top: 0px;
padding-left: 5px;
padding-right: 5px;
margin-left: auto;
margin-right: auto;
}

/* header navigation */
.outline {
border: #92928f 1px solid;
height: 22px;
background: #f7f7f3;
margin-left: auto;
margin-right: auto;
}

.outline2 {
border: #92928f 1px solid;
border-top: #92928f 0px solid;
height: 22px;
background: #f7f7f3;
margin-left: auto;
margin-right: auto;
}

.outline3 {
border: #92928f 1px solid;
border-top: #92928f 0px solid;
height: 30px;
background: #f7f7f3;
margin-left: auto;
margin-right: auto;
}

.topbox {
border: #d9d8d2 1px solid;
height: 20px;
background: #f7f7f3;
margin-left: auto;
margin-right: auto;
}

.mainnav {
border: #d9d8d2 1px solid;
height: 20px;
background: #837e7a;
margin-left: auto;
margin-right: auto;
}

.secondnav {
border: #d9d8d2 1px solid;
height: 28px;
background: #f7f7f3;
margin-left: auto;
margin-right: auto;
}

</style>

abduraooft
10-26-2009, 12:41 PM
.body {
font-family: Verdana, Helvetica, Arial, sans-serif;
background: #949ca9;
} .body is the selector for an element having class="body". So you need to either add that attribute in your html or remove the period(.) before .body in CSS

ahayzen
10-26-2009, 12:41 PM
Body tag should be written without the '.' because it a tag not a class


body{font-family: Verdana, Helvetica, Arial, sans-serif;
background: #949ca9;
}

stevenmw
10-26-2009, 01:01 PM
Body tag should be written without the '.' because it a tag not a class


body{font-family: Verdana, Helvetica, Arial, sans-serif;
background: #949ca9;
}



That's how I've got it, but it just doesn't work?

ahayzen
10-26-2009, 01:16 PM
No you have a dot before body take this away


body
{
font-family: Verdana, Helvetica, Arial, sans-serif;
background: #949ca9;
}

stevenmw
10-26-2009, 01:33 PM
No you have a dot before body take this away


body
{
font-family: Verdana, Helvetica, Arial, sans-serif;
background: #949ca9;
}


This is so weird... Haha. I didn't realize i had made body a class, but still. I've removed the period and it still doesnt work.

The code in the first post is now exactly like my code still is. See any problems? I don't...

ahayzen
10-26-2009, 01:54 PM
Sorry for slow reply - went for lunch!!!

The code you gave in the first post.

The CSS passes validation however the Html comes back an error. (error is at bottom)

You are writing your code in XHTML meaning that you need to close the link tag with a /> not >

Fixed Code


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="style.css"/>

<title>...</title>
</head>

<body>
<div class="page">
<div class="outline">
<div class="topbox">
</div>
</div>
<div class="outline2">
<div class="mainnav">
</div>
</div>
<div class="outline3">
<div class="secondnav">
</div>
</div>
</div>
</body>
</html>



# Error Line 5, Column 57: end tag for "link" omitted, but OMITTAG NO was specified

…t" href="style.css" type="text/cs…



You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
# Info Line 5: start tag was here

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

# Error Line 8, Column 7: XML Parsing Error: Opening and ending tag mismatch: link line 5 and head

</head>


# Error Line 26, Column 7: XML Parsing Error: Opening and ending tag mismatch: head line 3 and html

</html>


# Error Line 26, Column 7: XML Parsing Error: Premature end of data in tag html line 2

</html>

ahayzen
10-26-2009, 01:56 PM
By the way after changing the closing link tag this fixes all of the other errors!!

abduraooft
10-26-2009, 02:01 PM
This is so weird... Haha. I didn't realize i had made body a class, but still. I've removed the period and it still doesnt work.

The code in the first post is now exactly like my code still is. See any problems? I don't...Could you post your current code?

VIPStephan
10-26-2009, 02:11 PM
/* CSS Document */
<style type="text/css">

body {
font-family: Verdana, Helvetica, Arial, sans-serif;
background: #949ca9;
}



.secondnav {
border: #d9d8d2 1px solid;
height: 28px;
background: #f7f7f3;
margin-left: auto;
margin-right: auto;
}

</style>

This is not CSS, and therefore it doesn’t belong in a CSS file.

ahayzen
10-26-2009, 02:13 PM
take out the <style> tags and change the ending of the link tag to /> because you are writing in XHTML

stevenmw
10-27-2009, 12:00 AM
Thanks everyone. My problem was the <script> </script>

Those tags weren't needed.

chyssa
10-27-2009, 02:58 AM
Thanks for the advice and codes it can help a lot...



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum