디스플레이 인라인 블록 및 상자 크기 조정: 테두리 상자 속성을 사용하여 두 개의 div를 함께 배치할 때 테두리가 다를 때 흰색 빈 영역이 나타나는 이유는 무엇입니까?

Question

이 코드를 고려해 보세요. d3과 d4가 정렬되지 않은 이유는 무엇입니까? d4 상단의 공백은 무엇입니까?

으아악 으아악

이 두 div는 모두 인라인 블록을 렌더링해야 하며 너비가 150픽셀, 높이가 150픽셀이어야 하는데 두 번째 div가 첫 번째 div보다 약간 낮은 이유는 무엇입니까? 렌더링된 내용은 다음과 같습니다.

Answer 1

인라인 요소의 기본 세로 정렬이 기준선이기 때문입니다. top과 같은 값으로 설정하면 쉽게 변경할 수 있습니다.

으아아아 으아아아