보통 li는 inline-block 속성을 사용하면 약간의 여백이 생기는데, 이 문제가 귀찮아서 float:left 속성을 많이 사용한다.
하지만 float:left 속성을 주면 가운데 정렬이 어렵다.
이럴때 사용할 수 있는 방법.
.txt_btn{text-align:center;} .txt_btn ul{display:inline-block; *display:inline; zoom:1;} .txt_btn ul li{float:left; margin-left:-1px; z-index:1;}
전체 ul의 width값을 정해 준 후, position으로 가운데 정렬하는 방법도 있지만, li의 갯수가 늘어나면 width값도 같이 늘려줘야 하는 귀찮음이 있으므로,
이 방법을 선호하는 편.
'응용/실무 > CSS' 카테고리의 다른 글
-webkit-appearance 사용하기 (0) | 2016.03.29 |
---|---|
li에 float:left 속성 주고 가운데 정렬하기 (0) | 2016.02.24 |
IE8 이하 rgba 및 opacity 대체 기법 (0) | 2014.11.20 |
ie하위버전에 last-child 적용하기 (0) | 2014.11.19 |
텍스트가 길어지면 ... (점)으로 처리하기 (0) | 2014.11.07 |