플렉스 플렉스 박스, 오른쪽으로 밀기, 왼쪽으로 정렬하기, 너비 조절하기

Question

왼쪽, 쉽다.

모든 인 flexbox 쉽게 생각 :

하지만 RESPONSIVE 푸시 됨 우측하지만 왼쪽 맞춤, 작은 상자가 .. 포함 오른쪽 부분은 이미지를 볼 수에 대한

?

Answer 1

이 시도 :

.container { 
 
    display: flex; 
 
    justify-content: space-between; 
 
} 
 

 
.container > div { 
 
    display: flex; 
 
    flex-direction: column; 
 
} 
 

 
.right { 
 
    align-items: flex-start; 
 
} 
 

 
.left { 
 
    align-items: flex-end; 
 
} 
 

 
.box { 
 
    height: 40px; 
 
    width: 100px; 
 
    border: 1px solid blue; 
 
    margin-bottom: 5px; 
 
} 
 

 
.wide { 
 
    width: 200px; 
 
}

<div class="container"> 
 
    <div class="left"> 
 
    <div class="box wide"></div> 
 
    <div class="box"></div> 
 
    </div> 
 

 
    <div class="right"> 
 
    <div class="box wide"></div> 
 
    <div class="box"></div> 
 
    </div> 
 
</div>