너비 % 질문 드립니다.

Question

전체 width를 1400에 양쪽 20씩 총 40을 빼서

1360px에서 작업하려고 합니다.

컨텐츠를 440px로 만들고 가운데 컨텐츠를 양쪽으로 마진 20px씩주면 딱맞는데

왜인지 33.3333%로 만들면 마지막 컨텐츠가 밑으로 떨어지는데 이유가 뭔가요 ?ㅠㅠ

237248310_1623894788.7262.jpg

jayz · Accepted Answer

margin에 33.333%를 주었다는걸까요.

컨텐츠에 33.333%를 주었다는걸까요.

작업 영역에서의 33.333% 는 1360 / 33.33% 이므로 컨텐츠에 주었다면 더이상 마진을 줄 여유가 없기 때문에

마지막 컨텐츠가 떨어지는 것입니다.

이 경우 컨텐츠와 마진 넓이를 직접 계산하여 주셔야 하는데.

컨텐츠가 각 30% 일 경우 작업영역 안에서 margin이 들어갈 공간이 2곳이므로

남은 10% / 2 로

5%씩 주면 되겠네요.

long5472 · Answer

width: calc(XX% - 00px); 이용하셔서 맞춰주셔야할 것같은데요.

jayz님의 말씀처럼 마진들어갈 값이 없어 떨어지는 거같아요.

nth-child(X)로 이용해서 처음과 마지막 라인것을 조절하는것도 방법입니다.