Posted by John Dalberg on 10/18/06 01:07

I am creating a header which consists of two adjacent images and filling
the rest of the header width with a solid color so that different
resolutions have the same header. The effect works fine in IE (my users use
IE only) but there's a gap between the header and the rest of the page
which I can't get rid off. (The effect is also broken in Firefox but that's
not important)

How can I remove the gap (and make it work in FF also if possible )?

Tony

code below:
<style type="text/css">
#p3
{
background-repeat: repeat-x;
background-color: #5D7FA4;
width: auto;
float: left;
}

#p2
{
float: left;
}
</style>


header section:

<div id="p1" style="FLOAT: left; width: 202px; "><img
src="images/logo.jpg" border="0" alt="" width="202" height="64">
</div> <div id="p2"><img src="images/header_text.jpg" width="558"
height="64" border="0" alt=""> </div>
<div id="p3">
<img src="images/clearpixel.gif" width="100%" height="61">
</div>

• Next in forum: Re: email address obfuscation
• Prev in forum: <input type="file"> change where file gets uploaded?
• Thread view: problem with dynamic width div not filling with a color correctly

[Reply to this message]