Вопросы Теги

Высота контейнера начальной загрузки Twitter

Я использую twitter bootstrap и хотел бы, чтобы div-контейнер растягивался до нижней части страницы, но этого не происходит. Это всегда размер, соответствующий содержимому. Как это исправить?

<body>
    <div id="main-wrapper">
        <div class="navbar navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container">
                    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span>
                    <div class="nav-collapse">
                        <ul class="nav">
                           ....
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <div class="container">
            <div class="row">
               .....           
            </div>
        </div>

        <div class="container"> <!-- this is the one I want to stretch to the bottom -->
            <div class="row">
                <ui:insert name="body" />
            </div>
        </div>

        <div id="push"></div>
        </div>
        <footer role="contentinfo">
           footer content
        </footer>

    </body>

CSS:

footer[role="contentinfo"] {
    color: #666;
    background: black;
    padding: 18px 0;
}

footer[role="contentinfo"] p {
    margin: 0;
}
/* Sticky Footer styles begin */
html,body {
    height: 100%;
}

#push {
    height: 54px;
}

footer[role="contentinfo"] {
    height: 18px; /* accounts for padding */
}

#main-wrapper{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0px auto -54px;
}

Спасибо за любую помощь

Келли

5
задан Kelly Goedert 4 July 2012 в 17:27
поделиться