As many of you know I work for the Web-Empowered Church and develop the WEC Map extension, I have been working on version 2.0 and was about ready to release, until in one of our QA passes discovered the whole map disappearing in IE7 when anyone clicks on a marker.
Not unfamiliar with IE7’s less than stellar standards support, I suspected Javascript errors, although IE7 didn’t show any. After a few hours of testing it turns out that it was a problem with the template we were using, not anything that I did. Phew! There were two styles that somehow conflicted. I say “somehow” because there is no telling why in the world they should conflict. These were the two styles:
#footer {
position:relative;
top:1px;
background-color: #336699;
width:100%;
clear:both;
margin:0;
padding:1% 0;
text-align:center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: .75em;
color: #FFFFFF;
}
#right-col {
position:relative;
top:-10px;
right:-10px;
float:right;
width:220px;
voice-family: "\"}\"";
voice-family:inherit;
width:180px;
margin:0 0 -10px 0;
padding:10px;
background:#efefef;
font-size: .75em;
font-family: Verdana, Arial, Helvetica, sans-serif;
z-index:99;
}
I removed the position: relative stuff from the right-col, especially since we already float it, as well as the width from the footer. Then I just had to adjust the margins on the right column to make everything work as expected again:
#footer {
position:relative;
top:1px;
background-color: #336699;
clear:both;
margin:0;
padding:1% 0;
text-align:center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: .75em;
color: #FFFFFF;
}
#right-col {
float:right;
width:220px;
voice-family: "\"}\"";
voice-family:inherit;
width:180px;
margin:-10px -10px -10px 0;
padding:10px;
background:#efefef;
font-size: .75em;
font-family: Verdana, Arial, Helvetica, sans-serif;
z-index:99;
}
Don’t ask me why or how. That’s Internet Explorer for you. If you at all can, please do not use it. Use Safari or Opera or Firefox instead. The only reason us web guys still wrestle with IE is because the majority of people still uses it. That, and Microsoft is apparently incapable or unwilling to do anything about it. IE8 looks hopeful, but to really get up to par I think we will have to wait a few more years.
Tags: Technology by Christoph
No Comments »