0

Hey guys,

I cannot for the life of me figure this out. For some reason the footer and the header won't match in terms of color. I think it has something to do with the wrapper, but seriously this is annoying. They just won't match up, no matter what I do. I checked my CSS through W3C, but no errors came up.
Thanks for your help Dani community!

Cheers,
Jordan

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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

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

<body>

<div id="header">
	</div>
    

        <div class="wrapper">
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
           <p>&nbsp;</p>
             <div class="push"></div>
</div>


 <div class="footer">
             <p>Copyright (c) 2008</p>
    

</body>
</html>

CSS

@charset "utf-8";
/* CSS Document */

#header {
	width: 1000px;
	height: 50px;
	background: #681223;

}

/*
#footer {
	width: 1000px;
	height: 50px;
	background: #681223;

}
*/

     * {
    margin: 0;
    }
    html, body {
    height: 100%;
    }
    .wrapper {
    min-height: 100%;
    height: auto !important;
   height: 100%;
   margin: 0 auto -4em;
   
  }
  .footer, .push {
   height: 4em;
 

   }
.footer {
	width: 1000px;
	height: 50px;
	background: #681223
	
}

Edited by Jordian: n/a

3
Contributors
2
Replies
3
Views
7 Years
Discussion Span
Last Post by macgurl70
0

Downloaded your code and then screen shotted the output.

The colors are the same, used the eye dropper tool in photoshop to double check. Compare them with another color and see how they look compared to the same color. When looking at my monitor the bottom did look to be a different shade than the top but it turns out it only looked they were.

Attachments headerandfooter.gif 80.01 KB
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.