Log in

View Full Version : Gap on top of my header


moisea
12-21-2006, 12:39 AM
hello, i need some header image help please. i have a gap of about 10px on top between my header image and my site top border. i did put padding and margin to 0px on both the container and header selector without success.
This is my css file

#header{
background: black;
margin:0;
padding:0;
background-image:url(images/header.jpg) ;
height:114px;
}

#header h3{
color:red;
background: black;
}

#container {
width:770px;
margin:0 auto;
text-align:left;
border:5px solid #FFF;
}
And this how my xhtml codes look like:

<body>
<div id="container">

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

<div id="navigation"></div>
<div id="wrapper">
<div id="main-content">
etc..
anyway to fix that gap on top of my header please?
many thanks.
benniaustin
12-21-2006, 05:10 PM
try setting the margin of the <H1> to 0.

If you want a gap, set the padding instead.
moisea
12-22-2006, 12:31 PM
thanks Benni Austin, it works :) .however, when i tried to to set the gap on top again, it would not let me. Any idea why?
many thanks.
benniaustin
12-22-2006, 03:30 PM
h1 {
margin:0;
padding:10px;
}

That should have the desired effect, if you're desired effect is what I think.

You want the margin inside of the header, rather than outside. using on the <h1> should emulate a margin in this way.
moisea
12-24-2006, 02:01 AM
thanks benni :) . very helpful.