Re: [OpenLayers-Users] Map size without javascript
Hi
I was experiencing this too and I think I solved it by specifying top, left,
bottom and right on the html part of the css just like you do on the map.
Cheers Kris
-Original Message-
From: users-boun...@openlayers.org [mailto:users-boun...@openlayers.org] On
Behalf Of Ian Gibson
Sent: Monday, April 20, 2009 7:50 AM
To: users@openlayers.org
Subject: [OpenLayers-Users] Map size without javascript
Hi
I have a problem getting a pretty simple layout to function (solve this and it
should go straight on to the examples section of openlayers.org!). Creating a
map on a page with a 76px high header, such that the map div takes up the rest
of the available height.
The following works in firefox, but not in IE7 (IE7 shows the map div with the
correct size, but a red background and no map). Basically, I can solve the
problem with javascript, but it is a strong wish of my client that the map size
should be defined in CSS.
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
titleminOpenLayers.aspx/title
script type=text/javascript src=script/OpenLayers.js/script
script type=text/javascript
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
layer = new OpenLayers.Layer.WMS( OpenLayers WMS,
http://labs.metacarta.com/wms/vmap0;,
{layers: 'basic'} );
map.addLayer(layer);
map.zoomToMaxExtent();
}
/script
style type=text/css
html, body
{
height:100%;
width:100%;
}
body {
margin: 0;
}
#map
{
position:absolute;
top:76px;
bottom:0px;
left:0px;
right:0px;
background-color: Red;
}
/style
/head
body onload=init()
div id=map class=smallmap/div
/body
/html
Med venlig hilsen
Ian Wermer Gibson
IT konsulent
JO Informatik ApS
Trækbanen 16 A 1.sal
3000 Helsingør
(+45) 49 20 20 67
Dir. tlf: (+45) 48 40 40 16 * i...@jo-informatik.dk
___
Users mailing list
Users@openlayers.org
http://openlayers.org/mailman/listinfo/users
___
Users mailing list
Users@openlayers.org
http://openlayers.org/mailman/listinfo/users
Re: [OpenLayers-Users] Map size without javascript
Hi Ian,
If what Kris suggested doesn't work, you can always include an IE only
CSS file and put something like the code below in there (you'll need to
tweak the numbers):
#map {
width: expression(
(d = document.compatMode == CSS1Compat ?
document.documentElement : document.body)
(eval(d.clientWidth -335))
);
height: expression(
(d = document.compatMode == CSS1Compat ?
document.documentElement : document.body)
(eval(d.clientHeight -155))
);
}
Hope this helps.
Regards, Roald
Kris Geusebroek wrote:
Hi
I was experiencing this too and I think I solved it by specifying top, left,
bottom and right on the html part of the css just like you do on the map.
Cheers Kris
-Original Message-
From: users-boun...@openlayers.org [mailto:users-boun...@openlayers.org] On
Behalf Of Ian Gibson
Sent: Monday, April 20, 2009 7:50 AM
To: users@openlayers.org
Subject: [OpenLayers-Users] Map size without javascript
Hi
I have a problem getting a pretty simple layout to function (solve this and
it should go straight on to the examples section of openlayers.org!).
Creating a map on a page with a 76px high header, such that the map div takes
up the rest of the available height.
The following works in firefox, but not in IE7 (IE7 shows the map div with
the correct size, but a red background and no map). Basically, I can solve
the problem with javascript, but it is a strong wish of my client that the
map size should be defined in CSS.
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
titleminOpenLayers.aspx/title
script type=text/javascript src=script/OpenLayers.js/script
script type=text/javascript
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
layer = new OpenLayers.Layer.WMS( OpenLayers WMS,
http://labs.metacarta.com/wms/vmap0;,
{layers: 'basic'} );
map.addLayer(layer);
map.zoomToMaxExtent();
}
/script
style type=text/css
html, body
{
height:100%;
width:100%;
}
body {
margin: 0;
}
#map
{
position:absolute;
top:76px;
bottom:0px;
left:0px;
right:0px;
background-color: Red;
}
/style
/head
body onload=init()
div id=map class=smallmap/div
/body
/html
Med venlig hilsen
Ian Wermer Gibson
IT konsulent
JO Informatik ApS
Trækbanen 16 A 1.sal
3000 Helsingør
(+45) 49 20 20 67
Dir. tlf: (+45) 48 40 40 16 * i...@jo-informatik.dk
___
Users mailing list
Users@openlayers.org
http://openlayers.org/mailman/listinfo/users
___
Users mailing list
Users@openlayers.org
http://openlayers.org/mailman/listinfo/users
--
Roald de Wit
Software Engineer
roald.de...@lisasoft.com
Commercial Support for Open Source GIS Software
http://lisasoft.com/LISAsoft/SupportedProducts/
The contents of this email are confidential and may be subject to legal or
professional privilege and copyright. No representation is made that this email
is free of viruses or other defects. If you have received this communication in
error, you may not copy or distribute any part of it or otherwise disclose its
contents to anyone. Please advise the sender of your incorrect receipt of this
correspondence.
___
Users mailing list
Users@openlayers.org
http://openlayers.org/mailman/listinfo/users
Re: [OpenLayers-Users] Map size without javascript
Thank you both for your help. This problem really frustrated me last week but,
this morning I stumbled upon the following fix which wraps the map div in
another div and seems to do the job...
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
titleminOpenLayers.aspx/title
script type=text/javascript src=script/OpenLayers.js/script
script type=text/javascript
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
layer = new OpenLayers.Layer.WMS( OpenLayers WMS,
http://labs.metacarta.com/wms/vmap0;,
{layers: 'basic'} );
map.addLayer(layer);
map.zoomToMaxExtent();
}
/script
style type=text/css
#map
{
background-color: Red;
position: absolute;
width: 100%;
height: 100%;
}
#mapWrapper {
position: absolute;
background-color: Blue;
top: 76px;
bottom: 0px;
left: 0px;
right: 0px;
}
/style
/head
body onload=init()
div id=mapWrapperdiv id=map class=smallmap/div/div
/body
/html
Med venlig hilsen
Ian Wermer Gibson
Dir. tlf: (+45) 48 40 40 16 * i...@jo-informatik.dk
-Oprindelig meddelelse-
Fra: Roald de Wit [mailto:roald.de...@lisasoft.com]
Sendt: 20 April 2009 08:53
Til: Kris Geusebroek
Cc: Ian Gibson; users@openlayers.org
Emne: Re: [OpenLayers-Users] Map size without javascript
Hi Ian,
If what Kris suggested doesn't work, you can always include an IE only
CSS file and put something like the code below in there (you'll need to
tweak the numbers):
#map {
width: expression(
(d = document.compatMode == CSS1Compat ?
document.documentElement : document.body)
(eval(d.clientWidth -335))
);
height: expression(
(d = document.compatMode == CSS1Compat ?
document.documentElement : document.body)
(eval(d.clientHeight -155))
);
}
Hope this helps.
Regards, Roald
Kris Geusebroek wrote:
Hi
I was experiencing this too and I think I solved it by specifying top, left,
bottom and right on the html part of the css just like you do on the map.
Cheers Kris
-Original Message-
From: users-boun...@openlayers.org [mailto:users-boun...@openlayers.org] On
Behalf Of Ian Gibson
Sent: Monday, April 20, 2009 7:50 AM
To: users@openlayers.org
Subject: [OpenLayers-Users] Map size without javascript
Hi
I have a problem getting a pretty simple layout to function (solve this and
it should go straight on to the examples section of openlayers.org!).
Creating a map on a page with a 76px high header, such that the map div takes
up the rest of the available height.
The following works in firefox, but not in IE7 (IE7 shows the map div with
the correct size, but a red background and no map). Basically, I can solve
the problem with javascript, but it is a strong wish of my client that the
map size should be defined in CSS.
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
titleminOpenLayers.aspx/title
script type=text/javascript src=script/OpenLayers.js/script
script type=text/javascript
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
layer = new OpenLayers.Layer.WMS( OpenLayers WMS,
http://labs.metacarta.com/wms/vmap0;,
{layers: 'basic'} );
map.addLayer(layer);
map.zoomToMaxExtent();
}
/script
style type=text/css
html, body
{
height:100%;
width:100%;
}
body {
margin: 0;
}
#map
{
position:absolute;
top:76px;
bottom:0px;
left:0px;
right:0px;
background-color: Red;
}
/style
/head
body onload=init()
div id=map class=smallmap/div
/body
/html
Med venlig hilsen
Ian Wermer Gibson
IT konsulent
JO Informatik ApS
Trækbanen 16 A 1.sal
3000 Helsingør
(+45) 49 20 20 67
Dir. tlf: (+45) 48 40 40 16 * i...@jo-informatik.dk
___
Users mailing list
Users@openlayers.org
http://openlayers.org/mailman/listinfo/users
___
Users mailing list
Users@openlayers.org
http://openlayers.org/mailman/listinfo/users
--
Roald
