0
Как показано ниже, в теле есть divs, которые имеют плавающие элементы, но все они очищены.Почему тело не расширяется с помощью внутреннего элемента?
Кодекс (https://jsfiddle.net/4ke0cxg7/2/):
html, body {
height: 100%;
}
body {
background: grey;
}
#foot {
position: absolute;
bottom: 0;
background: white;
font-size: 16px;
font-weight: bold;
}
#h {
margin-bottom: 20px;
}
#wrapper {
margin-bottom: 30px;
}<body>
<div id="wrapper">
<div class="container-fluid">
<div class="row-fluid">
<div class="span9">
<div class="card card-small">
<div class="card-heading simple">
Phone Book
</div>
<div class="card-body">
<!-- I have other tabs here -->
<div class="tab-content">
<div class="active tab-pane" id="columns">
<table class="table table-striped table-condensed sampleTable">
<thead>
<tr>
<th> </th>
<th>Name</th>
<th>State</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr>
<td>0</td>
<td title="Scroll to the column">
<a href="javascript:void(0)" data-row-selector="true" class="column-selector">John</a>
</td>
<td>NY</td>
<td></td>
</tr>
<!-- Snipped for conciseness -->
<tr>
<td>21</td>
<td title="Scroll to the column">
<a href="javascript:void(0)" data-row-selector="true" class="column-selector">Rambo</a>
</td>
<td>NY</td>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="foot">
Footer
</div>
</body>Колонтитул висит в середине страницы. Почему тело не расширяется, чтобы содержать div #wrapper?
UPDATE: Я могу изменить любой стиль, кроме нижнего колонтитула (он контролируется другими ребятами). Почему тело не расширяется, чтобы содержать div?
заменить 'позицию: абсолютная;' 'с позиции: relative': https://jsfiddle.net/4ke0cxg7/3/?? –
Я не вижу проблемы, но вы не можете исправить проблему с CSS, если у вас нет контроля над CSS. – Rob
@Rob - Вы не видите проблему на jsFiddle? Нижний колонтитул прикрепляется к нижней части окна, а не к странице. Попробуйте уменьшить вертикальный размер области предварительного просмотра ... https://jsfiddle.net/4ke0cxg7/4/ – questions