2012-09-13 3 views
2

호를 발행합니다. 여기 이미지의 일부에서 여백이 제대로 렌더링되지 않는 이유를 알 수 없습니다. 첫 번째 및 두 번째 가로 방향 이미지 이후에는 여백이 그 위의 이미지/컨테이너와 겹칩니다.여백 및 이미지 문제가 생기면

누구나 밝힐 수 있습니까?

http://jsfiddle.net/JeffPannone/rDw6R/17/

* 죄송합니다 여러분. 이전에 잘못된 jsfiddle 링크를 제공했습니다. 나는 그것을 여기에서 바로 잡았다

답변

1

당신 div가 경계 또는 패딩을 가지고 있지 않기 때문에 div에서 이미지의 여백은 collapse이 될 수있다.

몇 가지 W3C 문서를 추가하고 있었지만 몇 줄에서 여백 붕괴에 대한 명확한 설명을 제공하는 것이 좋습니다. 위의 링크를 따라 자세한 정보를 확인하십시오.

간단한 수정은 1px 0의 패딩을 div에 추가하는 것입니다.

http://jsfiddle.net/rDw6R/1/

+0

내가 그 수정에 대해 알고 않았다, 그러나, 나는 잘못된 jsfiddle 예를 연결. 원래 게시물에서 수정했습니다. – jpann

4

하나의 옵션은 사업부로 overflow:auto을 설정하는 것입니다.

jsFiddle example

+2

+1 또는'overflow : hidden; ' – iambriansreed

+1

'overflow : hidden'은 부유 요소를 유지하는데 유용하다는 것을 알았습니다. 나는 패딩 수정 대신 이것을 사용하기 시작할 것입니다. +1 –

+0

그 픽스에 대해 알고 있었지만 잘못된 jsfiddle 예제를 연결했습니다. 원래 게시물에서 수정했습니다. – jpann

관련 문제