CSS column height different on Opera/IE to FF
Posted
by Infiniti Fizz
on Stack Overflow
See other posts from Stack Overflow
or by Infiniti Fizz
Published on 2010-04-25T21:21:43Z
Indexed on
2010/04/25
21:23 UTC
Read the original article
Hit count: 305
Hi all,
Thanks to everyone who helped with my last question but I've got a new browser-independent problem:
For some reason, the image navigator (not yet functioning) on a website I'm working on is currently not displaying in the correct place on Firefox. It appears in the right place in IE8 and Opera but Firefox seems to have a problem with it.
As can be seen in the below image, the imageContainer div (the image and the left/right arrows) appears on top of the footer, this is how it should look i.e. how it looks in IE8 and Opera.
But in the image below, the imageContainer div is cutting into the footer div for some reason, and I don't know why.
imageContainer has a margin-top: 110px;
to get it in the right place at the bottom of its column. There are 2 columns, the left housing the paragraphs and imageContainer and the right housing the Calendar and contact details. The footer div also has clear: both;
Also, it's not just the image that is falling into the footer, it's the arrows as well only they are the same colour as the footer so this isn't immediately apparent.
Any ideas why it isn't displaying correctly? Is there a better way of aligning the imageContainer to the bottom of it's column (to keep the box shape of the website) other than using the margin-top to position it?
Thanks in advance,
infinitifizz
© Stack Overflow or respective owner