<hr> 가운데정렬

2017. 3. 7. 17:04CSS

1. text-align을 사용하는 방법


hr{

text-align: center;

}

 


2. text-align과 margin을 같이 사용할 경우


hr{

margin: 0px auto;

}

 

   -> text-align과 margin을 같이 사용할 경우 margin에 의해서 text-align이 무시되어 가운데 정렬이 되지 않습니다. 그러므로 margin의 값을 auto로 설정하여 가운데 정렬을 시킵니다.


2. margin 설정

   -1) 4면이 모두 같을 때


margin: 상   우   하  좌

margin: 0px 0px 0px 0px;


margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

margin-left: 0px;

 


   -2) 4면이 모두 다를 때

margin: 0px;


   -3) 상하, 좌우로 설정 시



margin: 상하 좌우

margin: 0px  0px;



   -4) 상, 좌우, 하로 설정 시


margin: 상   좌우   하

margin: 0px  0px  0px;

 


* auto()는 MicroSoft(마이크로소프트)의 Internet Explorer8에서는 동작을 하지 않습니다.

'CSS' 카테고리의 다른 글

@font-face 사용규칙(eot, woff, otf/ttf, svg/svgz 차이)  (0) 2018.02.19
display & visibility 차이  (0) 2017.03.22
가로(width), 세로(height) % - px  (0) 2017.03.07
높이(height) 100% 설정하기  (0) 2017.03.07