Why isn't the position: fixed; property functioning in this CSS code?
body {
text-align : center ;
min-width : 770px ;
}
div.wrapper {
width : 770px ;
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
div.header {
color: blue;
padding: 15px;
margin: 0px;
text-align: center;
position: fixed;
}
div#main {
margin-left: 30%;
margin-top: 1px;
padding: 10px;
}
div.footer {
color: blue;
padding: 15px;
margin: 0px;
text-align: center;
}
HTML:
<body>
<div class="wrapper">
<div class="header">
<form action="<?php $_PHP_SELF ?>" method="GET">
Start Date: <input type="text" name="start" pattern="[0-9]{4}"/>
End Date: <input type="text" name="end" pattern="[0-9]{4}"/>
<input type="submit" />
</form>
</div>
<hr>
<div class="main">
<div id="donutchart" style="width: 900px; height: 500px;"></div>
<?php
$i=0;
foreach ($rows as $row) {
echo '<div id="chart'.$i.'_div" style="width: 900px; height: 500px;"></div>';
$i++;
}
?>
</div>
<hr>
<div class="footer">
©2014-<?php echo date("Y"); ?> guest
</div>
</div>
</body>