Fixed Head and Footer Prolems. HELP

[NiTx]

Hey guys.

Im new here but will be visiting alot as I have a huge passion in webdesign.

I've searched and googled everything and couldnt find out how to properly make a fixed, but expandable header banner. An example of what I want to make is www.google.com at the very top they have a header banner that is expandable.

Here is the code I have so far:

<title>Fixed header</title>
<style type="text/css">
body{
margin:0;
padding:<length> 0 0 0;
}
div#header{
position:absolute;
top:0;
left:0;
width:100%;
height:auto;
}
@media screen{
body>div#header{
position: fixed;
}
}
* html body{
overflow:hidden;
}
* html div#content{
height:100%;
overflow:auto;
}
</style>
<div id="header">Header</div>

Now this works, how ever its at a set hight and ive tried everything to make it so it isnt.

I just want to know how to make it so its easily adjusted verticaly and in size. My Banner is say 50 pixels high and wont fit on my codes footer for what ever reason.

I tried using a table which is ifne but it leaves 1-2 pixels of white padding around the edges which i dont want. Even with padding and obrders set to 0.

Please Help!

Thanks alot

[rangana]

To remove the padding around the table's edge, you need to ensure that there is no padding along the TD elements.

You can add this on your rule:

Code: Select all

* {
padding:0px;
/* margin: 0px; */ /* Adding this rule will remove all default margins on the element*/
}


Hope that helps.