2014-12-19 2 views
1

나는 모든 사각형이 동일한 크기의 정사각형 축소판 갤러리를 가지고 있습니다. 모든 미리보기 이미지는 링크입니다. 이 갤러리 전체를 가로로 정렬하고 싶지만 "margin : 0 auto;" 작동하지 않습니다. 어떤 도움을 주셔서 감사합니다!CSS가있는 센터 중앙 갤러리

http://jsfiddle.net/ds2uockq/

HTML: 
<div id="gallery"> 
    <a href="http://www.google.com"><img src="http://placekitten.com/g/150/150" /></a> 
    ... 
<div> 

CSS: 
#gallery { 
    margin: 0 auto; 
} 

답변

4

사용 text-align: center;

#gallery { 
    margin: 0 auto; 
    text-align: center; 
} 

working demo

이유는 텍스트 정렬 사용 했습니까?

#gallery에는 인라인 요소 즉 <a>이 포함되어 있습니다. 그리고 인라인 요소를 가운데 맞추기 위해 텍스트 정렬을 사용합니다.

+0

이 좋은 설명을 주셔서 감사합니다! 그것은 내가 생각했던 것보다 쉬웠다.) – krebas

1

는 여기 simple method

#gallery { 
    display: block; 
    width: 100%; 
    text-align: center; 
} 
2

그냥 몸과 컨테이너 폭을 제공합니다.

CSS :

body{ 
    width:100%; 
} 
gallery{ 
    width:70%; 
    margin:0 auto; 
}