Bugs with CSS code.

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • talk2tim
    New Member
    • Feb 2015
    • 19
    #1

    Bugs with CSS code.

    Hello Folks. First, i must admit how helpful you have been since i signed up here. Thank you all.

    Im following a PHP course and this is the code of the stylesheet


    Code:
    /*SITE COLORS :
    #1A446C - Blue grey
    #689DC1 - Light blue
    #D4E6F4 - Very light blue
    #EEE4B9 - Light tan
    #8D0D19 - Burgundy
    
*/

html { height: 100%; width: 100%; }

body { height: 100%; width: 100%; margin: 0; padding: 0; border: 0; background: #FFFFFF;
       font: 13px/15px Verdana, Arial, Helvetica, sans-serif; }

img { border: none;} 

table, tr, td { border-collapse: collapse; vertical-align: top; 
                text-align: left; 
                font: 13px/15px Verdana, Arial, Helvetica, sans-serif; }

a {color: #8D0D19;}
               
#header{ height: 70px; text-align: left; background: #1A446C; color: #D4E6F4; }

#header h1 { padding: 1em; margin: 0; }

/*Note: IE 5 & 6 won't understand min-height */

#main {min-height: 600px; width: 100%; background: #EEE489; padding: 2em; }
#footer { height: 2em; padding: 1cm; text-align: center;
	background: #1A446C; color: #D4E6F4; }

table.bordered tr th, table.bordered tr td { border: 1px solid #000000;}
    Now the page is supposed to turn out like this
    Click image for larger version Name: What i intend to achieve.jpg Views: 1 Size: 20.2 KB ID: 5418836

    But this is the top of my page due to error.
    Click image for larger version Name: Top of my own page due to css error.jpg Views: 1 Size: 10.2 KB ID: 5418837


    And the bott0m of my page due to error.
    Click image for larger version Name: Bottom of my own page due to error.jpg Views: 1 Size: 9.3 KB ID: 5418838



    The MENU, is supposed to be up and not at the bottom.

    Please help me, im not too proficient in CSS

    Or is it a bug in the PHP?

    And here are the header and footer codes. I hope they help too


    HEADER
    Code:
     <!DOCTYPE html>
<html lang="en">
    <head>
        
        <title>Zoomie Gallery: Admin</title>
        <link href="../stylesheets/main.css" media="all" rel="stylesheet" type="text/css"/>
    </head>
    <body>
        <div id="header">
            <h1>Your Zoomie Gallery: Admin</h1>
        </div>
        <div id="main">
            </div>
        </body>
    </html>


    FOOTER

    Code:
    </div>
<div id="footer">Copyright <?php echo date("Y", time());?>, Timothy Emmanson. Nailancer</div>
    </body>
</html>

<?php if(isset($database)) {$database->close_connection();} //If the database connection is there, then close it?>


    Thank you very much for your help
    Tags: None
    • talk2tim
      New Member
      • Feb 2015
      • 19
      #2
      Hey Folks!!! I have debugged it myself. It was indeed a HTML issue and not CSS. I was separated my header and footer and attached my layout to them so that wherever i include header or footer, the layout comes together with it. Pretty smart ei? Anyways, i was supposed to leave the html code on the header incomplete. i.e stop at main' and not close tags of body, head and html. That was why i ran into that error. I removed them those closing tags and Viola!!.


      THIS

      Code:
      !DOCTYPE html>
<html lang="en">
    <head>
 
        <title>Zoomie Gallery: Admin</title>
        <link href="../stylesheets/main.css" media="all" rel="stylesheet" type="text/css"/>
    </head>
    <body>
        <div id="header">
            <h1>Your Zoomie Gallery: Admin</h1>
        </div>
        <div id="main">
            </div>
        </body>
    </html>

      WAS SUPPOSED TO BE THIS

      Code:
      !DOCTYPE html>
<html lang="en">
    <head>
 
        <title>Zoomie Gallery: Admin</title>
        <link href="../stylesheets/main.css" media="all" rel="stylesheet" type="text/css"/>
    </head>
    <body>
        <div id="header">
            <h1>Your Zoomie Gallery: Admin</h1>
        </div>
        <div id="main">

      Spent some more time on the code and figured out the issue. Thanks anyway. I hope someone else learns from it. :-)

        Comment

        Previous template Next
        Working...