css - 带有图片库的 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 */
}