display: flex (1) 썸네일형 리스트형 display flex의 flex-basis, flex-grow, flex-shrink flex-basis display: flex flex-basis: 200px css code .container { display: flex; } .item:nth-child(1) { flex-basis: 200px; } 특정한 item의 size를 지정할 때, 사용합니다. contaier의 가로 사이즈가 늘어나면, 오른쪽 여백이 남고, 줄어들면 첫 번째 item의 가로 사이즈가 유연하게 줄어듭니다. flex-grow display: flex flex-glow: 1 css code .item:nth-child(2) { flex-grow: 1; } 특정한 item의 size를 채울 때 사용합니다. contaier의 가로 사이즈가 늘어나면, 두번째 item의 가로 사이즈가 유연하게 늘어나고, 줄어듭니다. f.. 이전 1 다음