Hi there,
I have a page that's misbehaving in firefox 2.
I am trying to apply a graphical look to my main content divs using a
set of images giving them rounded corners and shading.
My approach is to use background images on divs absolutely positioned
into the corners of the containing div, and z-indexed to go behind the
content. Here's a snippet showing the image handling:
<div id="customerSearchResults">
<div class="testDialogCorner"
style="top:0;left:0;background:url(c1.jpg) no-repeat top left;">
</div>
<div class="testDialogCorner"
style="top:0;right:0;background:url(c2.jpg) no-repeat top right;">
</div>
<div class="testDialogBorder"
style="left:0;background:url(bleft.jpg) repeat left;"></div>
<div class="testDialogBorder"
style="right:0;background:url(bright.jpg);background-repeat:repeat;background-position:right;">
</div>
<div class="testDialogCorner"
style="bottom:0;left:0;background:url(c3.jpg) no-repeat bottom left;">
</div>
<div class="testDialogCorner"
style="bottom:0;right:0;background:url(c4.jpg) no-repeat bottom
right;"></div>
<div id="customerSearchResultsHeader" >
<!-- here is some actual content -->
Here's the problem: in firefox 2, the margin-top on
customerSearchResultsHeader div is dragging down the background images
on the Dialog image-holding divs, which surely shouldn't happen.
You can see I need to push the column headings down, but it shifts the
image too. Has anyone else come across this?
This is the HTML: http://www.gargantus.com/sylvie/flow.htm
I discovered a work-around by making the content divs absolute too, but
I would rather leave them relative.
Thanks
Adam
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
