Akbar Ali
Akbar Ali

Reputation: 305

Leaflet - Map is not getting center aligned


I am using leafletjs to show map. I am not able to fix the map to center. When i, re size the window, then the map seems fixing itself to center. I have created a fiddle . This problem occurs in this specific scenario of HTML
This is my HTML

    <div id="test">click</div>
    <div id ="left" style = "width:100px; height:500px; float:left; background-color:red"></div> 
    <div style ="width:100%">
       <div style ="width:80%; height:auto">
          <div id="list" style = "height:500px;background-color:black"></div>
          <div id="map" style = "height:500px;display:none"></div>
       </div>
    </div>

Upvotes: 1

Views: 5271

Answers (1)

Mics
Mics

Reputation: 1430

Map canvas' position and size should be fixed before map created. Hide/show <div>s first, then create map. Change order of createMap(); and $("#map").show();$("#list").hide();.

fiddle: http://jsfiddle.net/e6y5k/

Upvotes: 3

Related Questions