[OpenLayers-Users] width+height 100% in standards-compliant mode

Nathan Gerber ngerber999 at gmail.com
Wed Jun 4 08:00:43 EDT 2008


The quickest way I found to do this and to keep the website standards
compliant is to implement JavaScript to do my resizing for me. The following
code is what I use (please note that I only tested in the major web
browsers):

<script type="text/javascript">
    window.onresize = resizeWindow;
    function resizeWindow() {
        var browser_height    = 0;
        try {
            if (parseInt(document.documentElement.clientHeight) >
browser_height) {
                browser_height =
parseInt(document.documentElement.clientHeight);
            }
        } catch(e) {  }
        if (!browser_height || isNaN(browser_height)) { browser_height = 0;
}
        if (browser_height == 0) {
            try {
                if (parseInt(document.body.clientHeight) > browser_height) {
                    browser_height = parseInt(document.body.clientHeight);
                }
            } catch(e) {  }
            if (!browser_height || isNaN(browser_height)) { browser_height =
0; }
        }
        document.getElementById('map').style.height = browser_height+'px';
    }
</script>
<body onload="resizeWindow();init();">

On Wed, Jun 4, 2008 at 5:46 AM, Andreas Hocevar <andreas.hocevar at gmail.com>
wrote:

> Hi,
>
> I need some advice on how to style an OpenLayers map that should have
> a 1-pixel border and fill 100% of the view port. This is no problem in
> quirks mode, but in standards compliant mode it won't work in IE. This
> is the CSS I have now:
>
>            html, body {
>                width: 100%;
>                height: 100%;
>                overflow: hidden;
>                margin: 0px;
>            }
>            #map {
>                border: 1px solid black;
>                position: absolute;
>                bottom: 0px;
>                top: 0px;
>                left: 0px;
>                right: 0px;
>            }
>
> In IE (6+7), I see the borders, but no map. If I add "height:100%" to
> #map, I see the map (with all borders in IE6+7, without bottom border
> in FF), but when opening a popup in IE 7, the map disappears. It works
> fine in quirks mode, but I need standards compliant mode for this
> application.
>
> Any help would be highly appreciated.
>
> Thanks
> Andreas.
> _______________________________________________
> Users mailing list
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
>



-- 
--
Nathan Gerber
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20080604/fce5da5b/attachment.html


More information about the Users mailing list