代码之家  ›  专栏  ›  技术社区  ›  De Papier

上/下页边距百分比在firefox中不起作用[重复]

  •  2
  • De Papier  · 技术社区  · 8 年前

    <div class="container1" style="display: flex; flex-direction: column;">
       <div class="div1" style="height: 100px; margin-bottom: 1%; background-color: green;"> This is div 1 </div>
       <div class="div2" style="height: 100px; background-color: blue"> This is div 2 </div>
    </div>
    

    它在IE或Chrome中运行良好,但在Firefox中不起作用。

    2 回复  |  直到 8 年前
        1
  •  1
  •   Rohit Verma    8 年前

    您可以使用 px 而不是 % 为了定义边距,它在任何地方都有效(所有浏览器)

    <div class="container1" style="display: flex; flex-direction: column;">
       <div class="div1" style="height: 100px; margin-bottom:10px; background-color: green;"> This is div 1 </div>
       <div class="div2" style="height: 100px; background-color: blue"> This is div 2 </div>
    </div>
        2
  •  0
  •   Emipro Technologies Pvt. Ltd.    8 年前

    这是由于 display:flex 与工作不好 % 在Firefox中。所以在这里你需要使用 display:block container1 部门。

    使用时使用此代码 %

    <div class="container1" style="display: block; flex-direction: column;">
       <div class="div1" style="height: 100px; margin-bottom: 1%; background-color: green;"> This is div 1 </div>
       <div class="div2" style="height: 100px; background-color: blue"> This is div 2 </div>
    </div>
    

    <div class="container1" style="display: flex; flex-direction: column;">
       <div class="div1" style="height: 100px; margin-bottom: 10px; background-color: green;"> This is div 1 </div>
       <div class="div2" style="height: 100px; background-color: blue"> This is div 2 </div>
    </div>