Carol F. Swinehart wrote:
> http://www.controlledairsystems.com/test/
> 
> This css is working, but I now want to make the banner narrower by 
> making the left picture smaller and floating the full size of the
> right picture over the edge of the banner so it hangs down.

For a start: set that class="leftone" on the image at the left side.

Corrected CSS:
#banner {
text-align: left;
margin-top: 0;
background-color: #EEEADF;
color: #003BB4;
font-family: arial, helvetica, sans-serif;
height:160px;
padding-top: 1px;

}
#banner img.leftone
{
float: left;
margin: -1px 0 -30px 0;
}

#banner img.imgabsolute{
z-index: 5;
float: right;
position: relative;
margin: -1px 0 -30px 0;
}


#banner h1
{
text-align: center;
  color: #003BB4;
  background-color: transparent;
  font-size: 18px;
  margin-top: 0;/* or what you like */
}
...is tested, and working as you want in IE6, Opera, Safari and Firefox.

Those negative margin-bottom on floating images make it possible to hang
them over the edge in IE/win - regardless of its "layout-mess".
Position: relative and a suitable z-index makes the right image visible
all the way.

regards
        Georg
-- 
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to