Question

我试图将div（称为面板）移动到另一个div下面的底部。但是当我在div（panel_1）下面移动面板时，页面下面就没有空间了。我想在下面进一步移动div（面板）。我应该能够滚动到div（面板）。

我如何实现这一目标？

PS：对不起我的英文

＆＃13;

@media (max-width: 400px) {
  .panel {
    position: fixed;
    bottom: 0;
    width: 100%;
  }
}

＆＃13;

<div class="panel"></div>
<div class="panel_1"></div>

＆＃13;

Answer 1

声明页面的高度，如果没有设置为足以包含所有ur元素

＆＃13;

@media (max-width: 400px) { /* adjust to your needs */
  .panel {
    position: fixed;
    bottom: 0px;
    width:100%;
  }
}


.body{height 1000px;}
 .panel {
    background: red;
    height:10px;
  }
  .panel_1{background: blue;
  height:10px;}

＆＃13;

  <div class="panel">

    </div>

    <div class="panel_1">
    </div>

＆＃13;

Answer 2

我们有CSS属性 margin 来创建周围的空间目标元素的每一面。

希望这会对你有所帮助:)。

尝试下面的代码段。

＆＃13;

<div id="panel1" style="border:solid;width:150px;height:150px;">
</div>
<div id="panel2" style="border:solid;width:150px;height:90px;margin-top:1%;">
</div>

＆＃13;

如何在较小的屏幕上将div移动到另一个div

2 个答案: