Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Проблема с высотой дива

Автор: Garret 8.2.2010, 11:20

Добрый день, есть такая задача и такая проблема.

Нужно сделать на странице рамку с однопиксельным бордером и так что бы в зависимости от контента она увеличивалась по высоте(и была еще минимальная высота).

Код

#wrapper {
    margin: 5px auto;
    width: 908px;
    min-height: 1120px;
    border: 1px #EE7F00 solid;
    background-color: #fff;
    background: url('images/background.jpg');
    background-repeat: no-repeat;
}

Если контент сразу внутри этого дива, то все нормально. Но если контент расположен еще в одном диве, то wrapper не увеличивается по высоте и содержимое просто налазит на рамку :( Стили внутреннего дива:

Код

#flowers_wrapper {
    width: 99%;
    float:left;
    min-height: 300px;
}

И сам код страницы:

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <link href="styles.css" type=text/css rel="stylesheet">
</head>
<body>

<div id="wrapper">

<div id="flowers_wrapper">
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
        <img src="images/test.png" /><br/>
</div>

</div>

</body>
</html>

Проблема эта в ФФ и Опере, ИЕ не смотрел. Возможно тут все элементарно, я просто со стилями на "вы". Буду рад помощи.

Автор: blah 8.2.2010, 11:32

В ие будет все нормально smile

#wrapper {overflow:hidden}
или убрать

Код


float:left;

с #flowers_wrapper

Автор: Garret 8.2.2010, 12:36

Действительно, спасибо smile

Интересно почему так.

Столько всего пробовал, а убрать флоат не подумал.