css를 사용한 중앙정렬
html/css 2008. 10. 9. 14:19css속성중에 'margin'이란 속성이 있는데 이걸 이용해서 block element에 대해서 중앙 정렬을 할 수가 있다.
div { margin: 0 auto }
위와 같이 css에 div태그에 대해 auto속성을 주면 중앙 정렬을 할 수가 있다.
요즘에 css코딩이 대세인지라 페이지 레이아웃을 div로 잡기 때문에 중앙 정렬을 하기 위해선 위와 같은 방법을 쓰는 것 같다.
참조 : http://wiki.standardmag.org/css_align
--
이것 때문에
div { margin: 0 auto }
위와 같이 css에 div태그에 대해 auto속성을 주면 중앙 정렬을 할 수가 있다.
요즘에 css코딩이 대세인지라 페이지 레이아웃을 div로 잡기 때문에 중앙 정렬을 하기 위해선 위와 같은 방법을 쓰는 것 같다.
참조 : http://wiki.standardmag.org/css_align
--
이것 때문에
<div style="width: 200px; height: 20px; border:1px solid #000;">
<div style="width:1px: border:1px solid #000">|</div>
<div style="width:1px: border:1px solid #000">|</div>
<div>
위와 비슷하게 코딩을 해서 보니 좌측정렬이 돼야 하는데 중앙정렬만 계속 돼서 삽질..;;
그래서 style에 margin:0을 선언해서 해결했다.
그래서 style에 margin:0을 선언해서 해결했다.
<div style="width: 200px; height: 20px; border:1px solid #000; margin:0; text-align:left;">
<div style="width:1px: border:1px solid #000; margin:0;">|</div>
<div style="width:1px: border:1px solid #000; margin:0;">|</div>
<div>
'html/css' 카테고리의 다른 글
[Link] 오픈소스 웹 디자인 소스 (0) | 2009.07.13 |
---|---|
[Link] 웹 페이지 로드 속도 단축하기 from IBM developerWorks (0) | 2009.06.25 |
HTML <label> tag (0) | 2008.08.13 |