fan-ky
-
Posts
6 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by fan-ky
-
-
Вот код, который иллюстрирует проблему - http://jsfiddle.net/5S7mR/
<!DOCTYPE html>
<html>
<head>
<style>
#sidebar {width: 200px; border: 1px dashed #000; float: left;}
#content {width: 500px; margin-left: 210px; border: 1px dashed #000;}
#content .checkout-nav-controls{margin-top:20px;width:400px;border:1px dashed #ccc;}
#content .checkout-nav-controls .prev-control{float:left;}
#content .checkout-nav-controls .next-control{float:right;}
.clear{width:100%;height:1px;overflow:hidden;clear:both;float:none;visibility:hidden;}
</style>
</head>
<body>
<div id="sidebar"><br><br><br><br><br><br><br><br></div>
<div id="content">
Some text
<div class="checkout-nav-controls">
<a href="checkout_authorization.html" class="prev-control">< Назад</a>
<input type="submit" value="Далее" class="next-control" />
<div class="clear"></div>
</div>
some text<br>
some text
</div>
</body>
</html>Высоту в моем случае задать можно, но хочется разобраться в чем же дело. А в другом случае фиксированная высота не подошла бы.
-
Есть подозрения что, на вашей странице кроме приведенного примера существуют другие блоки с float:left/right. Лучше всего дайте ссылку на вашу страницу или напишите код тут - http://jsfiddle.net/
Только что понял, что блок растягивается по высоте ровно до того места, где заканчивается левый сайдбар с меню. Что с этим делать? Может другой способ clear'a нужен?
-
firebug/любой другой инспектор и смотри, что создает отступ
Ничего не создает - высота у блока такая. Если prev-control next-control сделать без флоатов, высота все равно остается. Если убрать clear, то все становится нормально.
-
fan-ky, Создай отдельный контекст форматирования с помощью overflow:hidden;
Поясни, пожалуйста, что это значит?
Chuv, я понимаю, что проблема не в том участке кода. Потому что если воссоздать этот кусок в отдельном документе, то проблемы не наблюдается.
На странице, конечно, есть другие блоки с флоатами. Заливать код не хочу так, как это реальный проект. Если есть версии, подскажите, куда копать.
-
Привет всем.
Прилагаю изображение с проблемой. В контейнере два флоата, после контейнера clear. Непонятно откуда появляется слишком большой отступ.
Где искать проблему?
Большой отступ перед clear
in HTML Coding
Posted
Сначала не понял, что ты имел в виду, потом сделал для блока .checkout-nav-controls {overflow:hidden;}. Все встало на свои места.
Кто-нибудь может пояснить, почему такое поведение и можно ли обойтись без overflow:hidden;?
NeoXidizer, про добавить к #content float:left - я когда только начинал верстать макет от этого почему-то отказался, не помню почему, может и не из объективных причин, но сейчас уже поздно - многое поедет, наверное
. Завтра поэкспериментирую еще, напишу.