You can see the difference here:
http://img534.imageshack.us/img534/8269/screenshot20120813at557.png
Any ideas? A negative margin is being used to pull the image “up” - I’m thinking that may have something to do with it? The problem only occurs in IE (of course).
I would recommend putting that image in there as a background image, which is much more reliable.
Unfortunately, I didn’t build this website. It’s currently set up in Joomla with the header as a module so it can easily be changed on each page. Setting it as a background image would lose some of that flexibility. Also, if the negative margin was causing the issue, wouldn’t there still be a problem?
Hm, rather than pull the slider section up, it would have been better to position the form div absolutely over it. That would work better. Yes, I didn’t look closely enough at where the negative margin was. It doesn’t matter whether you use the image in the HTML or as a bg image. (Sorry for that red herring.)
http://174.132.149.157/~hslprope/index.php/apartments
Nice! But for some reason it’s still off a bit in IE. Not enough of the header image is showing.
I can’t test it in IE right now, but probably a better approach here is to place the form div inside the slider section. Then you can accurately place it in relation to the slicer section.
You have a .push style given to IE9 only which doesn’t seem to be necessary.
.push{top:-310px;padding-top:150px; margin-bottom:-310px;}
Remove it and ie9 should work.
BTW IE9 will very rarely need margin changes (apart from the odd pixel) so don’t hack it into submission as the cause is usually somewhere else.