Height 100% of a section / container: how to do?

  • Is it possible to set 100% height to the map so I can fill a whole section or div?

    I read another post here that 100% doesn’t work but is there a way to fix this?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor hupe13

    (@hupe13)

    Try [leaflet-map height=100vh]. vh means the height of the viewport height. (See the last answer here.)

    It might not be exactly what you want. Leaflet Map needs a (fixed) value to determine its height.

    • This reply was modified 1 year, 7 months ago by hupe13.

    Hi,

    if somebody else comes to here: That is not a problem of the map, it’s (mostly) a problem of the CSS layout. The height=100% of the map is working as it should, but it’s relative to the parent container. So: If you don’t give the parent container a real (not relative) height, the browser will calculate it to 0px. I suggest reading tutorials as CSS positioning is not trivial. A good starting point is e.g. https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Positioning#positioning_contexts

    Best, Jan

    Plugin Contributor hupe13

    (@hupe13)

    @g4rf Danke!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Height 100% of a section / container: how to do?’ is closed to new replies.