兩個div彼此相鄰

Question

我有兩個div相鄰，並且工作正常，但是當您更改瀏覽器或設備的大小時，我希望將第二個div放在第一個div的下面，但這不適用於此代碼。

這是鏈接： http : //jsfiddle.net/rvzthd6v/

<div class="wrap">
<div class="one">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempor eu arcu quis tristique. Vestibulum vel odio scelerisque, placerat leo porttitor, dapibus sapien. Sed lacus ante, posuere eu mollis quis, interdum sit amet est. Aliquam tincidunt, arcu vitae pretium viverra, eros elit ultricies ante, in convallis ante erat sed nunc. Aliquam feugiat mollis lacinia. Nulla non dolor sit amet eros vehicula gravida ut ac nisi. Aliquam ut congue metus. Mauris id justo in arcu viverra lobortis. Duis dictum malesuada libero quis fermentum.      </div>
<div class="two">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempor eu arcu quis tristique. Vestibulum vel odio scelerisque, placerat leo porttitor, dapibus sapien. Sed lacus ante, posuere eu mollis quis, interdum sit amet est. Aliquam tincidunt, arcu vitae pretium viverra, eros elit ultricies ante, in convallis ante erat sed nunc. Aliquam feugiat mollis lacinia. Nulla non dolor sit amet eros vehicula gravida ut ac nisi. Aliquam ut congue metus. Mauris id justo in arcu viverra lobortis. Duis dictum malesuada libero quis fermentum.</div>

div.wrap {clear:both; margin: 0 auto; position: relative;}
div.one {float: left; border: 1px solid black; max-width: 40%; margin-right: 5%;}
div.two {float: left; max-width: 40%; border: 1px solid black;}

謝謝

Answer 1

如果添加min-width ，則可以實現以下目的： http : //jsfiddle.net/v393gd3o/

div.one {
     float: left; 
     border: 1px solid black; 
     min-width: 200px; 
     max-width: 40%; 
     margin-right: 5%;
}


div.two {
    float: left;
    min-width: 200px; 
    max-width: 40%; 
    border: 1px solid black;
}

Answer 2

要將一個div放在另一個div之下，可以使用CSS FlexBox

您需要將<div class="wrap">為display: flex和flex-direction: row和內部div將彼此相鄰放置。

比將<div class="wrap">為flex-direction: column和內部div將被放置在“ column”（列）中-一個在另一個下面。

您可以為其他@media設置此類行為。 或檢查wrapper-div / browser大小更改並從一種樣式切換到另一種樣式。