이미지 갤러리가있는 div는 센터를 정렬하지 않습니다.

Question

저는 많은 사람들과 자습서를 통해 자신을 구축 한 포트폴리오를 가지고 있습니다. 나는 실제 갤러리 (현재 8 개의 엄지 손가락을 특징으로 함)가 중심에 있지 않음을 알아 챘다. 특히 모바일 크기로 조정하면 약간의 도둑이 생깁니다.

나는 'imagewrapper'라는 div에서 갤러리를 감쌌다.

.imagewrapper{ 
    width: 80%; 
    margin: 0 auto; 
    height:100%; 
} 

내 div의 정렬에 너비가 엉망입니까? 전체 코드는 여기에 있습니다. http://kellyvuijst.nl. 나를 올바른 방향으로 보낼 수 있다면 좋을 것입니다.

Answer 1

나는 당신의 CSS에 몇 가지 변화를 만들 것입니다 :

.imagewrapper{ 
    width: 80%; 
    margin: 0 auto; 
    height:100%; 
    text-align: center; /* add this */ 
} 

.mask { 
    position:relative; 
    height:180px; 
    width:240px; 
    box-shadow:0 0 1px #000; 
    border:5px solid #f6f6f6; 
    overflow:hidden; 
    float:left; /* delete this */ 
    margin:15px; 
    display: inline-block; /* add this */ 
}