css - margin-top/bottom % not works in firefox -


i have 2 divs arrange column in flex, want distance = 1%, code:

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

it works in ie or chrome not works in firefox. how can fix it?

please try code.

it's due display:flex not working % in firefox. here need used display:block container1 div.

use code when using % in margin-bottom.

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

please try code when using px not % in margin-bottom.

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

Comments

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -