Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

Recently I wanted to make an overlay on an existing page. Of course on all browsers works fine.. except IE. Although it made an interesting effect - one round corner - this can be seen at http://wenecja.com.pl/index_plakatowanie.html (you need to have adblock disabled on firefox). So how this had happen? Sorry for the sloppy css, but this wasn't an objective

#wrapper_lokacja { position: absolute; top: 0; left: 0; width: 100%; 
                   height: 100%; display: none; -moz-box-sizing: content-box; }
#wrapper_lokacja #overlay_lokacja { position: absolute; top: 0; left: 0; 
    width: 100%; height: 100%;
    z-index: 0; background: url( "/_img/lokalizacja/overlay.png" );
    filter:alpha(opacity=50); -moz-box-sizing: content-box; 
    -khtml-opacity: 0.5; opacity: 0.5;
}

#wrapper_lokacja #text { width: 800px; height: 500px; position: absolute; 
    background-color: #fc0; text-align: center; font-family: "Arial Black";
    border: 13px solid #333;
    -moz-box-sizing: content-box;
    -moz-box-shadow: 1px 1px 10px #222;
    left: 50%; top: 50%; margin: -250px 0 0 -400px;
}
#label, #map, #paczka, #exit { position: absolute;-moz-box-sizing: content-box;
     overflow: visible }
#label { top: 20px; left: 242px; z-index: 0; }

#wrapper_lokacja p,#wrapper_lokacja h1,
    #wrapper_lokacja h2 { position: relative; z-index: 20; padding: 0; 
        color: black; font-family: "Arial Black"; overflow: visible; 
        background: none; -moz-box-sizing: content-box; }
#wrapper_lokacja h1 { font-size: 48px; height: 48px; margin-bottom: 0; 
        margin-top: 15px; }
#wrapper_lokacja h2 { font-size: 18px; line-height: 1em; margin: 9px 0 0 0;}
#wrapper_lokacja h2 { margin-top /*\**/: -9px\9; } /* IE 8 hack */
#high_text { margin: 2em 0 0 0; font-size: 14px;}
#wrapper_lokacja #high_text em { font-style: normal;  font-size: 16px;}
#map { bottom: 0; left: 0; z-index: 2; }
#mapkaT { margin: 0; padding: 0; position: absolute; bottom: 203px; left: 0; 
    z-index: 10; }
#mapkaR { margin: 0; padding: 0; position: absolute; bottom: 0 ; left: 184px;
    z-index: 10; }
#mapaFrame { position: absolute; bottom: -5px; z-index: 5;}
#paczka {  bottom:0; right: 27px;}
#exit { top: 0; right: 0;}
#wrapper_lokacja #lower_text { font-size: 13px; color: #004460; 
    margin-top: 40px;}
share|improve this question
    
This belongs on stackoverflow.com –  RandomBen Jul 23 '10 at 19:11
2  
@RandomBen - doctype.com would be a better place, but I agree with the close vote. –  Tim Post Jul 23 '10 at 19:20
    
@Tim - Good point. Either one would be fine. –  RandomBen Jul 23 '10 at 19:25
    
And to @Merstzik - Congrats, its hard enough to do that intentionally. –  Tim Post Jul 23 '10 at 19:38
2  
I'm hesitant to deal the final blow to this question to be honest. If dealing with CSS isn't a part of webmastering, then what is? –  Mark Henderson Jul 23 '10 at 22:21
add comment

closed as off topic by RandomBen, Tim Post, Bryson, artlung, Kinopiko Jul 24 '10 at 2:43

Questions on Webmasters Stack Exchange are expected to relate to webmastering within the scope defined by the community. Consider editing the question or leaving comments for improvement if you believe the question can be reworded to fit within the scope. Read more about reopening questions here.If this question can be reworded to fit the rules in the help center, please edit the question.

Browse other questions tagged or ask your own question.