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/
