Wedding gets trashed in IE8 :-(

Buongiorno from 8 degrees C wet & foggy Wetherby UK…

In IE 8 this page www.davidclick.com presents layout problems all of which are illustrated here:
http://i216.photobucket.com/albums/cc53/zymurgy_bucket/ie-8-layout-glitch-2_zps4d2c85f0.jpg

Whilst i am trying to get hold of the original developer It would be great if anyone could spot whats triggering the illustrated issues.

Thanks in advance,
David

Hi,

Regarding the menu have you enabled media queries to work in IE8?

I didn’t look at your code yet as I am in a bit of a rush but it looks as though you haven’t added media query support with the js polyfill.

http://code.google.com/p/css3-mediaqueries-js/

Hi there,

You have a mistake on your code, and this is one big mistake:


.am-wrapper:hover .overlayInner {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha([B]Opacity=1[/B])";
    filter: alpha([B]opacity=1[/B]);
    padding-top: 0; }

and should be like this:


.am-wrapper:hover .overlayInner {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha([B][COLOR="#FF0000"]Opacity=100[/COLOR][/B])";
    filter: alpha([B][COLOR="#FF0000"]opacity=100[/COLOR][/B]);
    padding-top: 20px; }

and one more thing, also need to hide/show the “hr” on hover copy/paste the following code


.am-wrapper .overlay hr {
    visibility: hidden;
}
.am-wrapper:hover .overlay hr {
    visibility: visible;
}

also if you want to have that transparent background you should do some hacks to work in IE8, check the code below


.ie8 .am-wrapper:hover .overlay  {
    background:#000;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

I think its a pretty cool callback for IE8.

For me looks good in IE8 and IE9 ( You had some issues with IE9 also … )

Hi Miron,

Bi thank you for your reply, I’ll aplly fixes soon and will post back here for an update :slight_smile:

Well spotted :slight_smile:

Big Thank you Bi, your solution has got rid of the odd horizontal klines in IE 8 :slight_smile: Thank you so much for taking time out to fix this on my behalf :slight_smile:

Thank you so much, your solution fixed an onging headache!