Chrome에서 세로 여백이 깨지지 않음

이 피들에서 http://jsfiddle.net/munkii/tpQQN/ 인트로 수업을 통해 단락 요소에 약간의 마진 바닥이 있으며, what-is 클래스를 통해 목록 항목에 여백이 있습니다.Chrome에서 세로 여백이 깨지지 않음

즉, 내 직장에서 불필요한 여백을 제거하지만 여전히 FF와 IE 그렇게되면 크롬 수직 여백을 붕괴되지 않는 이유를 알고 관심이있다

article.about .what-is { 
    height: 100%; 
    margin-bottom: 34px; 
    padding-right: 34px; 
    width: 600px; 
} 

article.about p.intro { 
    font-weight: bold; 
    margin-bottom: 43px; 
}

의견이 있으십니까?

출처

2013-01-18 Pat Long - Munkii Yebee

당신은 당신이 높이를 제거 할 때 사라집니다나요 : 100 %를 뭐야-인 리 항목에서? – Alex

버그 일 수 있습니다. 최후의 흐름 자녀와 부모의 하단 여백의

아래쪽 여백 부모가 '자동'계산 높이
가있는 경우 : 우리가이 경우에 같은

는 http://www.w3.org/TR/CSS2/box.html#collapsing-margins에 따르면 이러한 마진은 붕괴한다

.what-is '높이로 계산되어야

auto

경우
때문에 containin의 높이 g 블록이 명시 적으로 지정되지 않은 경우 (즉, 콘텐츠 높이에 따라 다름)이 요소는 절대 위치 지정되지 않고 값이 '자동'으로 계산됩니다.

(http://www.w3.org/TR/CSS2/visudet.html#the-height-property)

별난 것은 계산 된 높이가 참으로 auto 것을이지만, 크롬 그것이 의미하는 것을하지 않는 것 같다.

Alex의 설명에 따르면 height: 100%; 규칙을 제거 할 수 있습니다.이 규칙을 사용하면 요소의 기본 높이를 고려할 수 있습니다. auto입니다.

출처

2014-01-16 21:00:15 MatTheCat

물론 MatTheCat입니다.

높이가 100 %이기 때문에 Firefox는 div가 포함 된 높이를 높이로 사용합니다. Chrome에서 p 태그의 마진 아래 부분이 포함 된 Div의 높이에 포함되는 것 같습니다. 그 어떤 의미가있는 경우

...

출처

2014-01-16 21:07:48 polarcare

Chrome에서 세로 여백이 깨지지 않음

답변

관련 문제