CSS: find the cause of a large white space on a page
I have the following CSS code that somehow causes a very large white space after my header image. Can you guys help me determine where this is coming from?
Here's the CSS, can you see where I am making the mistake here?
body {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#report { width: 835px; }
table{
border-collapse: collapse;
border: none;
font: 10pt Verdana, Geneva, Arial, Helvetica, sans-serif;
color: black;
margin-bottom: 10px;
}
table td{
font-size: 12px;
padding-left: 0px;
padding-right: 20px;
text-align: left;
}
table th {
font-size: 12px;
font-weight: bold;
padding-left: 0px;
padding-right: 20px;
text-align: left;
}
h2{ clear: both; font-size: 130%;color:#354B5E;position:relative;}
h3{
clear: both;
font-size: 75%;
margin-left: 20px;
margin-top: 30px;
margin-bottom: 50px;
color:#475F77;
}
h4{
clear: both;
font-size: 90%;
text-align: right;
vertical-align: bottom;
color:#475F44;
}
.wrap {
font-size: 60%;
text-align: right;
vertical-align: bottom;
color:#FFFFFF;
position:relative;
background:#466788;
margin:0 auto;
width:100%;
}
#header, #footer {
position:fixed;
bottom:0;
right: 0%;
z-index:999999;
background:#466788;
/*text-align: right;*/
color:#FFFFFF;
width:100%;
}
img {
position: relative;
top: 0;
left: 0;
width : 100%;
margin-bottom : 500px;
}
p{ margin-left: 20px;
font-size: 12px; }
table.list{ float: left; }
table.list td:nth-child(1){
font-weight: bold;
border-right: 1px grey solid;
text-align: right;
position: relative;
}
table.list td:nth-child(2){ padding-left: 7px; }
table tr:nth-child(even) td:nth-child(even){ background: #BBBBBB; }
table tr:nth-child(odd) td:nth-child(odd){ background: #F2F2F2; }
table tr:nth-child(even) td:nth-child(odd){ background: #DDDDDD; }
table tr:nth-child(odd) td:nth-child(even){ background: #E5E5E5; }
div.column { width: 320px; float: left; }
div.first{ padding-right: 20px; border-right: 1px grey solid; }
div.second{ margin-left: 30px; }
table{ margin-left: 20px; }
and HTML
<title>Migrations for 2014-06-11 0800</title>
<link rel="stylesheet" type="text/css" href="file://dellbook/Migmon/MigMon.css" />
</head><body>
<img src="\\DELLBOOK\Migmon\logo.jpg" width=100%><h2>Migration Group: <b>2014-06-11 0800</b></h2><P>Great work today, all remaining computers for this Migration group are marked as 'Migration Completed' in SharePoint.</P>
<table id="my_table">
<colgroup><col/><col/><col/><col/><col/><col/><col/></colgroup>
<thead>
<tr><th>MigrationStatus</th><th>User</th><th>ComputerName</th><th>Location</th><th>Ipv4</th><th>Domain</th><th>Online</th></tr>
</thead>
+3
source to share
4 answers