un-relative-ise the text...

[Mouse77e]

http://afterthemouse.com/new-gallery

what is it i cant remember that unsets the text from being relative?
it is late here and the brain is already asleep... but all the text in the boxes is relative to the shape of the image to the left and therfore all wrong... ahhhggggg!

many thanks, Mouse

<code>
.gallery-tag-text {
position: relative;
left: 215px;
left: 215px;
top: 3px;
border: 1px solid #b8b8b8;
margin-bottom: 0.5em;
width: 300px;
padding: 10px 10px 10px 10px;
}
</code>

[WebJoel]

http://afterthemouse.com/new-gallery

what is it i cant remember that unsets the text from being relative?
it is late here and the brain is already asleep... but all the text in the boxes is relative to the shape of the image to the left and therfore all wrong... ahhhggggg!

many thanks, Mouse

<code>
.gallery-tag-text {
position: relative;
left: 215px;
left: 215px;
top: 3px;
border: 1px solid #b8b8b8;
margin-bottom: 0.5em;
width: 300px;
padding: 10px 10px 10px 10px;
}
</code> An element is "position:static;" by default, so stating "position:relative;" makes it, um, "relative".

If you need the container DIV class="gallery-tag-text" to be "position:relative;", and the text be not relative, add:
.gallery-tag-text p {position:static;}. If you don't need this, just change "relative" to "static" (or, just remove "position:relative;" and let the default position of static be).

And you only need one left: 215px; here

I don't know how all this applies (or helps) your page. I see what you have... looks okay in Fx but too far to the right in IE, huh?

[Centauri]

This is caused by misunderstanding relative positioning. Positioning something relatively does not move the actual object, but only displays it in a different position. As the image and its wrappers are floated left, the .gallery-tag-text div is actually sliding behind the image, and the text within is correctly flowing around the floated image - positioning it relatively just moves the display of this to the right, still leaving the text float wrap. In IE, due to the div having a width set and therefore "HasLayout", the div incorrectly does not slide behind the picture, and the relative offset is shoving it further to the right.

If the entire section to the right of each main picture had a container floated against the picture, then you could probably considerably reduce the number of divs and get rid of the relative positioning.

[Mouse77e]

i am still a relatave noobie with writing myown css layouts, i'll work on this tosay!

many thanks