How to get a leaflet map canvas to have a 100% height?

by

The best way is to use the CSS length units vh and vw. These allow a block-level HTML element to have a dimension relative to the viewport size, instead of the size of its parent element (as % does).

e.g.:

#map {
  width: 100vw;
  height: 100vh;
}

For reference: https://developer.mozilla.org/en-US/docs/Web/CSS/length

More Related Contents:

  1. How to display an chage photo option on mouse hover similar to linkedin using Javascript? [closed]
  2. How to force browser to show image 3 inches wide?
  3. Syntax Higlighter For Site [closed]
  4. Reloading a single div in an html page [closed]
  5. How do you inject this code into HTML using Javascript?
  6. fixing slider on my website [closed]
  7. Full-screen iframe with a height of 100%
  8. How To Get Font Size in HTML
  9. Cache busting via params
  10. Remove CSS class from element with JavaScript (no jQuery) [duplicate]
  11. Hide scrollbar while still being able to scroll with mouse/keyboard [duplicate]
  12. execCommand() is now obsolete, what’s the alternative?
  13. How to create a custom scrollbar on a div (Facebook style)
  14. Have a div cling to top of screen if scrolled down past it [duplicate]
  15. HTML book-like pagination
  16. Passing mouse clicks through an overlaying element
  17. Highcharts – issue about full chart width
  18. Fill available spaces between labels with dots or hyphens
  19. How to make text over flow into two columns automatically
  20. How to resize Twitter Bootstrap modal dynamically based on the content
  21. Uncaught TypeError: Cannot read property ‘top’ of undefined
  22. Are data attribute css selectors faster than class selectors?
  23. Wait cursor over entire html page
  24. How to display file name for custom styled input file using jquery?
  25. In JQuery, Is it possible to get callback function after setting new css rule?
  26. How to create a “show more” button and specify how many lines of text can be initially shown
  27. Include SVG files with HTML, and still be able to apply styles to them?
  28. A way to scroll an underlying div when mouse is on top of a fixed div?
  29. Custom Checkbox
  30. Bootstrap Dropdown menu is not working

Leave a Comment