CSS позиционирование: контейнер не соответствует размеру содержимого - PullRequest
0 голосов
/ 11 августа 2011

HTML:

<div content>
  <div post>
  <div post> 
  ...
</div>

CSS:

.post {
    margin: 0; padding: 110px 20px 20px;
    float: left;
    width: 560px;
    position: relative;
    display: block;
}
#content {
    display: block;
    padding: 15px;
    overflow: visible // hidden
    min-height: 250px;
}

Когда #content установлен на overflow:visible, он нене соответствуют размеру его содержимого, т. е. каждое сообщение хорошо отображается, но высота #content является его минимальной высотой.

Когда установлено overflow:hidden, #content адаптирует свой размер к своему содержимому, но.post сокращены до метрики #content..post содержит position:absolute элементы, расположенные за пределами .post с отрицательными полями.

Может ли #content соответствовать высоте .post и в то же время не разрезать его по бокам?*

Ответы [ 4 ]

2 голосов
/ 11 августа 2011

Если у вас есть объекты, плавающие внутри контейнера со свойством min-height, он не будет расширяться. Вам нужно очистить float на .post, и тогда контейнер будет расти, как и положено.

0 голосов
/ 13 ноября 2013

Попробуйте изменить свойство переполнения контейнера на «auto»; у меня это сработало:

https://stackoverflow.com/a/17807687/888367

0 голосов
/ 11 августа 2011

Что вы думаете об этом ...

http://jsfiddle.net/UnsungHero97/dBMxE/2/

Попробуйте вставить больше или вынуть <div class="post"></div> элементов.

Надеюсь, это поможет.

0 голосов
/ 11 августа 2011

Это то, что вы пытаетесь сделать?

http://jsfiddle.net/k4t434sispho3nix/swwTn/

...