Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    Regular Coder stevenmw's Avatar
    Join Date
    Jun 2007
    Location
    OK
    Posts
    497
    Thanks
    27
    Thanked 31 Times in 31 Posts

    body tag not working in css

    Fo some reason my body tag won't work. Everything in the stylesheet works except the body piece.

    Here is my html:
    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>
    Here is my css:
    Code:
    /* 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>
    Last edited by stevenmw; 10-26-2009 at 01:31 PM.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    .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
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Regular Coder ahayzen's Avatar
    Join Date
    Jun 2009
    Posts
    110
    Thanks
    8
    Thanked 11 Times in 11 Posts
    Body tag should be written without the '.' because it a tag not a class

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

  • #4
    Regular Coder stevenmw's Avatar
    Join Date
    Jun 2007
    Location
    OK
    Posts
    497
    Thanks
    27
    Thanked 31 Times in 31 Posts
    Quote Originally Posted by ahayzen View Post
    Body tag should be written without the '.' because it a tag not a class

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

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

  • #5
    Regular Coder ahayzen's Avatar
    Join Date
    Jun 2009
    Posts
    110
    Thanks
    8
    Thanked 11 Times in 11 Posts
    No you have a dot before body take this away
    Code:
    body
    {
    font-family: Verdana, Helvetica, Arial, sans-serif;
    background: #949ca9;
    }

  • #6
    Regular Coder stevenmw's Avatar
    Join Date
    Jun 2007
    Location
    OK
    Posts
    497
    Thanks
    27
    Thanked 31 Times in 31 Posts
    Quote Originally Posted by ahayzen View Post
    No you have a dot before body take this away
    Code:
    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...

  • #7
    Regular Coder ahayzen's Avatar
    Join Date
    Jun 2009
    Posts
    110
    Thanks
    8
    Thanked 11 Times in 11 Posts
    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
    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>

  • Users who have thanked ahayzen for this post:

    stevenmw (10-26-2009)

  • #8
    Regular Coder ahayzen's Avatar
    Join Date
    Jun 2009
    Posts
    110
    Thanks
    8
    Thanked 11 Times in 11 Posts
    By the way after changing the closing link tag this fixes all of the other errors!!

  • #9
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    Quote Originally Posted by stevenmw View Post
    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?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #10
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,471
    Thanks
    6
    Thanked 980 Times in 953 Posts
    Quote Originally Posted by stevenmw View Post
    Code:
    /* 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.

  • Users who have thanked VIPStephan for this post:

    stevenmw (10-26-2009)

  • #11
    Regular Coder ahayzen's Avatar
    Join Date
    Jun 2009
    Posts
    110
    Thanks
    8
    Thanked 11 Times in 11 Posts
    take out the <style> tags and change the ending of the link tag to /> because you are writing in XHTML

  • #12
    Regular Coder stevenmw's Avatar
    Join Date
    Jun 2007
    Location
    OK
    Posts
    497
    Thanks
    27
    Thanked 31 Times in 31 Posts

    Thanks

    Thanks everyone. My problem was the <script> </script>

    Those tags weren't needed.

  • #13
    New to the CF scene
    Join Date
    Oct 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the advice and codes it can help a lot...


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •