Aug 24, 2012, 7:17 AM
[CLOSED] Div inside a Panel gets 0px height when set to 100% CSS height
Hi,
I'm using a Viewport with a BorderLayout (west and center region only).
The center region only contains a <content> block with HTML elements:
100% width works fine, but if I'm using 100% height the map gets 0px height after loading the page, using a static height like 1000px works, nevertheless, I need to display the map always as 100% / 100% within that center region.
edit: things like height:80% don't work as well, as soon as I'm using a percentage the height gets 0px.
Any idea what might be the problem?
Regards
I'm using a Viewport with a BorderLayout (west and center region only).
The center region only contains a <content> block with HTML elements:
<ext:Panel runat="server" Region="Center" ID="mapPanel" Collapsible="false">
<Content>
<div id="map">
</div>
....
....
....
</Content>
</ext:Panel>
The map div contains a leaflet map (http://leaflet.cloudmade.com), this div is set to 100% width and height in the CSS. 100% width works fine, but if I'm using 100% height the map gets 0px height after loading the page, using a static height like 1000px works, nevertheless, I need to display the map always as 100% / 100% within that center region.
edit: things like height:80% don't work as well, as soon as I'm using a percentage the height gets 0px.
Any idea what might be the problem?
Regards
Last edited by Daniil; Aug 28, 2012 at 5:14 PM.
Reason: [CLOSED]