본문 바로가기

padding

(2)
세로로 반복되는 배경 이미지 위에 내용물을 입힐 때 의도하지 않은 빈 줄 없애는 방법 아래와 같은 경우 빈 줄이 생길 수 있습니다. ㅠ.ㅜIE 호환성보기에서는 빈 줄이 생기지 않지만, IE 기본모드와 비 IE 웹브라우저에서 발생.아마도, 반복되는 배경 이미지가 입혀져야 하는 height 를 자동으로 산출할 수 없기 때문에 발생하는 듯.. 세로로 반복되는 배경 이미지를 놓고..1. 그 안에 margin 을 사용할 때, margin 대신 padding 사용으로 해결2. 그 안에 float 를 사용할 때, clear:both 로 float 정지 ... ... 아래와 같이 margin 대신에 padding 을 사용해 보세요. ... ... ... ... 아래와 같이 float:left 가 들어간 동일 레벨 마지막에 clear:both 스타일을 먹여 보세요. ... ...
CSS 레이아웃 블럭을 가운데 정렬하는 방법 (margin:0 auto) 금방 떠오르는 생각은 text-align 속성을 사용하는 것인데요. text-align:center 로 하면 하위 요소에 상속을 주기 때문에 하위 블럭 안의 내용이 모두 가운데 정렬이 되어 버려요. 블럭 안의 내용은 가운데 정렬이 아니면서 블럭이 상위 블럭의 가운데로 표시되게 하려면 text-align 은 답이 아닙니다. 검색해 보시면, 가운데 정렬할때 maring:0 auto 를 주라는 것이 많을 거에요. margin 옵션의 값으로 "0 auto" 를 주라는 것인데, "0 auto" 는 "0 auto 0 auto" 와 동일한 의미입니다. 이전에 "10px 20px 30px 40px" 처럼 썼던 것은 기억하시죠..? 맨 처음 값이 블럭의 상단, 다음이 우측, 세번째가 하단, 네번쨰가 좌측, 이런식이죠. ..