map setting width and height in inline style

[KierenHarvey]

I have this scenario where an inline style is applied to the 'map' div setting the width and height to 400?
e.g. <div class="map" style="width: 400px; height: 400px"></div>

This is happening intermittently after new'ing up the esri map:
self.map = new esri.Map("map", {
                extent: self.gismapConfig.initialExtent,
                logo: true,
                infoWindow: popup,
                autoResize: true
            });
What might cause this??


Thanks

[derekswingley1]

If the element where a map is being created doesn't have a width and height, the API defaults to using 400 for both. This is defined in esri.config.defaults.map.height and esri.config.defaults.map.width.

To overcome this, specify a width and height on your element that will become a map (this could be an inline style, something in a style tag or in a .css file). See the create a map sample for an example that uses 100% for width and height:  http://help.arcgis.com/en/webapi/javascript/arcgis/samples/map_simple/index.html

[KierenHarvey]

The containing div had a width set (via a css style). I'm using bootstrap for layout.

It seemed that the DOM hadn't loaded when new'ing up the map. I rejigged where I'm wiring up the map and seems to have stopped applying the inline style, and filling the space defined by the parent div.

[KierenHarvey]

width & height config options aren't documented?

Closest I found was:
http://help.arcgis.com/en/webapi/javascript/arcgis/jsapi/#namespace_esri/config
http://help.arcgis.com/en/webapi/javascript/arcgis/jshelp/#inside_defaults

A link from the Map class doc would be nice 🙂