jeffrey morin wrote:
> http://melissagerstein.com/tests/affinity_css/.
>
> my issue is the absolutely positioned "wow" image in the middle
> column. it looks fine on all browsers but in iemac it gets pushed
> down so that it covers the border of the box it is in. can anyone
> tell me why this happens?
I think you mean IE5/Mac, and the reason is that the box is too short.
Not enough text.
> i don't really know how to use hacks for the IE mac browser but if i
> have to i obviously will.
If you only want what you have to look right in IE5/Mac, then this will
do...
#wowImage {
position: absolute;
right: 2px;
top: 45px;
/*\*//*/
top: 40px;
/**/
}
...but it can't take font resizing in any browser without breaking. Such
line-ups with text as "place-holder" for absolute positioned elements,
usually break under the slightest stress.
---
The real weakness with the absolute positioned image is that it is no
longer in the flow. The text is partially covered by the 'wow' image in
every single browser on earth if text is resized only a few steps up at
the user-end. That's a pretty normal scenario when small text is used.
If you want your design to be able to take some stress - from font
resizing and otherwise, then I'd advice you to float the image and make
the text and borderbox adjust to its presence.
Something like...
#wowImage {
float: right;
margin: -20px 2px -14px 2px /* adjust to taste */;
}
.yellowBorderBox {
overflow: hidden;
}
* html .yellowBorderBox {
overflow: visible;
display: inline-block;
}
...should work quite well across browser-land, once the absolute
positioned version is taken out.
regards
Georg
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
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/
