Openlayers dynamic viewport width and height assignment? [closed]

Question

I display an openlayers map in a html page by placing it in a tag and assigning a css class to it so as to set its dimensions (map size and map bounds).

i then attempt to dynamically create a style element (my custom division class), append it to the document and change the map class to this custom style.

2 unintended things happen:

1. just appending the style to the document changes the class of the map division (bad DOM on my part, surely);

2. the map division still uses "old" bounds (does not center correctly on zoom);

Can anyone recommend a better approach to this situation?

Code and further details on this stackoverflow post

Answer 1

After the container size is changed you have to update the map size and recalculate bounds:

map.updateSize();

You can check the OL documentation http://dev.openlayers.org/docs/files/OpenLayers/Map-js.html#OpenLayers.Map.updateSize