Question

我花了几个小时搜索这个问题的解决方案。我找到的只是所需行为的反转。正如标题所说，我想要的是我的＆＃39;＆＃39;容器倒塌并且当它具有属性时没有高度＆＃39;位置：固定＆＃39; 这是代码块。

<div style="position:fixed;right:0;bottom:0">
    <div style="float:left">First DIV</div>
    <div style="float:left">Second DIV</div>
</div>

谢谢

Answer 1

基于评论

我希望在容器中分组多个聊天块的行为（例如在Facebook或其他网站上的常见聊天客户端）。容器是固定在右下方的块，窗口包含一个或多个聊天块。

所以，事实上，不的高度为零，但似乎你希望div的高度不超过其内容的总和。

如果没有在div上指定高度，那么这将是固定位置div的默认值。

这样的事情就足够了。

.mydiv {
  background: lightblue;
  position: fixed;
  right: 0;
  bottom: 0;
}
.mydiv div {
  border-bottom: 1px solid red;
  max-width: 200px;
  background: lightgreen;
}
.mydiv div:nth-child(even) {
  background: lightgrey;
}

<div class="mydiv">
  <div>First DIV</div>
  <div>Second DIV</div>
  <div>Third loooooong DIV</div>
  <div>Fourth DIV</div>
  <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam facere dolorum amet eum eos alias.</div>
</div>

Answer 2

我想我有问题的答案。我在主容器和具有绝对位置的元素之间放置了一个中间容器。代码变成了：

<div id="main_container">
  <div id="middle_container">
    <div class="element">First DIV</div>
    <div class="element">Second DIV</div>
    ...
  </div>
</div>


#main_container{
position : fixed;
right : 0;
bottom : 0;
}
#middle_container{
position : absolute;
right : 0;
bottom: 0;
}
.element{
float : left;
}

感谢大家的回复。抱歉问题描述清晰。

Answer 3

添加高度：0px和溢出：隐藏到容器div

我想要我的容器块的崩溃行为

3 个答案: