Question

我的图片库看起来像这样：https://drive.google.com/open?id=0BwBGhbPaJU_jdUl3cGdNQjVNVjg

正如你可以看到我的画廊，我希望下方和图像之间的空间消失。（用箭头表示）

这是我的代码：

＆＃13;

/*Gallery*/
#works-gallery{
	margin:0px;
	position:relative;
	top:900px;
	width:1440;
	text-align:center;
	line-height: 0;
	column-count: auto;
	column-gap:0px;
	-webkit-column-count:auto;
	-webkit-column-gap:0px;
	-moz-column-count:auto;
	-moz-column-gap:0px;
}

#works-gallery img {
	postion:relative;
	display:inline-block;
	width:480px;
	height:auto;
	top:0px;
	vertical-align:top;
	padding:0px;
	border:0px;
}

＆＃13;

<div id="works-gallery">

    <img src="http://lorempixel.com/480/320/abstract" class="tile" /><img src="http://lorempixel.com/480/456/city" class="tile" /><img src="http://lorempixel.com/480/456/city" class="tile" />
    
    <td><img src="http://lorempixel.com/480/234/fashion" class="tile" /><img src="http://lorempixel.com/480/567/food" class="tile" /><img src="http://lorempixel.com/480/356/nature" class="tile" />
        
    <img src="http://lorempixel.com/480/678/nightlife" class="tile" /><img src="http://lorempixel.com/480/243/people" class="tile" /><img src="http://lorempixel.com/480/678/sports" class="tile" />
        
    <img src="http://lorempixel.com/480/256/technics" class="tile" /><img src="http://lorempixel.com/480/678/transport" class="tile" /><img src="http://lorempixel.com/480/235/abstract" class="tile" />
        
    <img src="http://lorempixel.com/480/678/animals" class="tile" /><img src="http://lorempixel.com/480/657/city" class="tile" /><img src="http://lorempixel.com/480/789/fashion" class="tile" />

</div>

＆＃13;

我有什么需要改变的？

Answer 1

尝试删除垂直对齐属性

删除库中相同宽度的图像之间的垂直空白区域

1 个答案: