Twitter Bootstrap: div в контейнере с высотой 100%
Используя Twitter bootstrap (2), у меня есть простая страница с панелью навигации, а внутриcontainer Я хочу добавить div с высотой 100% (внизу экрана). Мой css-fu ржавый, и я не могу решить это.
Простой HTML:
<body>
<div class="navbar navbar-fixed-top">
<!-- Rest of nav bar chopped from here -->
</div>
<div class="container fill">
<div id="map"></div> <!-- This one wants to be 100% height -->
</div>
</body>
Текущий CSS:
#map {
width: 100%;
height: 100%;
min-height: 100%;
}
html, body {
height: 100%;
}
.fill {
min-height: 100%;
}
Я добавил высоту к классу заливки, как предложено ниже. Но проблема в том, что я добавляю верхнюю часть тела к телу, чтобы учесть фиксированную панель навигации вверху. Это влияет на 100% высоту "карты" div и означает, что полоса прокрутки добавляется - как показано здесь:http://jsfiddle.net/S3Gvf/2/ Может кто-нибудь сказать мне, как исправить?