float 및 inline-block에 대한 생각

플로트

장점:

가로로 정렬하는 것이 더 편리하고 브라우저 호환성 문제도 없습니다.

단점:

1) 여러 행을 가로로 배열하면 줄 바꿈 후 맨 위 행이 표시되지 않는 경우가 많습니다.

2) 플로팅 후에는 현재 흐름에서 벗어나 상위 요소가 크게 붕괴됩니다. 솔루션은 상대적으로 성숙하고 통일되어 있으며 브라우저 호환성 문제가 없습니다.

인라인 블록

단점: 가장 큰 문제는 브라우저마다 흰색 공백을 해결하는 방법이 달라서 통일이 어렵고 호환성이 좋지 않다는 것입니다. 일반적인 해결책은 상위 요소에 글꼴 크기:0을 설정하는 것입니다. 대부분의 브라우저는 이를 수행할 수 있으며 일부 브라우저의 경우 레이아웃에 영향을 주지 않고 display: 테이블을 추가할 수 있습니다. 개인적으로 나는 문자 공간과 단어 공간을 사용하는 것을 좋아하지 않습니다. 나는 항상 브라우저마다 다른 문제가 있을 것이라고 생각합니다.

장점: 줄 바꿈 시 맨 위 줄이 표시됩니다. text-align, 공백 및 기타 속성을 사용하여 양쪽을 정렬하면 효과가 좋습니다. :nowrap은 줄을 감쌀 수 없으며 때로는 기적적인 효과가 있습니다.

먼저 작성하고 시간나면 추가하세요