Question

我有一个背景颜色的主div。我在该div中放入一个登录窗口，宽度为：675px;高度：300像素;还有窗口顶部/底部的边距。背景并没有增长以适应div。这是我正在使用的代码：

  <div class="main">
    <div class="topLine"></div>
    <div class="loginWindow">
      <div class="logo">
        TEXT
      </div>

    </div>

    <div style="clear: both"></div>

  </div>

CSS：

.main {
  background: linear-gradient(to bottom right, #152d47, #467ba7);
  width:100%;
  height:100px;
  padding-top:8px;
  overflow:hidden;
}

.loginWindow {
  margin:0 auto; 
  width:675px;
  margin-top:172px;
  margin-bottom:115px;
  height:300px;
}

这是jsfiddle：https://jsfiddle.net/grem28/uj5zbhf7/

Answer 1

删除父级的高度，如果您希望它可以增长或将其更改为 min-height

Answer 2

好吧，使用overflow:visible;代替overflow:hidden;

Answer 3

将高度更改为100％并移除溢出，或将其更改为可见。这是带溢出的CSS注释掉的。

.main {
  background: linear-gradient(to bottom right, #152d47, #467ba7); 
  width:100%;
  height:100%;
  padding-top:8px;
  /* overflow: visible; */
}

这是更新的jsfiddle：https://jsfiddle.net/uj5zbhf7/4/

我有一个不与内容一起成长的div

3 个答案: