Hello-
I can't find any info about styling a div with borders when the div includes a background image.
I have a container div tag immediately following the body tag in the html that wraps all content.
I styled a 1 px solid gray border around this wrapping div yet it doesn't show up all around.. just across the top and a little down the sides. It appears as if the background images being used in divs that are within the container div are on-top and covering up the border.
I'm wondering how this is happening in both IE6/7, and FF.
Is there a way to "send to front" the border styling for the master container div?
I don't know if this will
I don't know if this will work but you could set the background of your master div to transparent and give it a position other than static. Positioned elements by default have a greater z-index than non-positioned(static) elements. I Don't know about how floats are ranked within the hierarchy of z-index though but you could look it up. Also adjust the z-index value so that it has a greater value than those of the contained div's.
z-index definition(Html Utopia: Designing Without Tables Using CSS - Dan Shafer): For any element for which the position property is other than static, this property sets the stacking order relative to other positioned elements within the same stacking context
Non-positioned elements are always positioned beneath all positioned elements in the same stacking context; they effectively have a z-index of 0. Elements in the same stacking context with the same z-index are stacked in the order they appear in the document(html), with later elements overlaying earlier ones.
#masterdiv{ position: absolute; background: transparent; /*so that when the masterdiv lays on top the rest is not obscured*/ z-index: (higher value than the z-index of the contained div-s) }
show your code or give a
show your code or give a link
my bet is that you used floats or absolute positioning which are both taken out of the document flow.
I'll get a test page posted
I'll get a test page posted but yes, I am using absolute positioning within the mater container div that is set to relative.
I'm guessing I will have to put the boarders in the background graphics or overlay a 'transparent' div with the highest z-index.
Thanks,
I think that should do the
I think that should do the trick but indeed try to post a sample page so we can test and tell you what works and what doesn't!
Quote: I'm guessing I will
I'm guessing I will have to put the boarders in the background graphics or overlay a 'transparent' div with the highest z-index.
huh? Don't touch z-index with a 10 foot pole. What does that possibly have to do with a background not appearing????
Oh wait, were you trying to make visitors to your site unable to click any links or highlight any text?