Html 内联显示留下空白

在我的底部有一个媒体画廊。前三张照片是照片库，内联后我放了一些视频缩略图。由于某种原因，视频库中每个元素的对齐都被弄乱了。你能帮我吗

这是每个视频缩略图的HTML：

<?php  if((get_post_meta($post->ID, 'url_video3', true))) { ?>
<div class="video_container">
<a href="#TB_inline?inlineId=url_video3&width=600&height=400" class="thickbox video">
<?php $attachment_id = get_field('icona_video3'); echo wp_get_attachment_image( $attachment_id, icona); ?>
<div class="play-icona"><img src="<?php bloginfo('template_url'); ?>/images/video_link.png" /></div>
</a>
</div>
<?php } ?>

---

一般来说，

内联块

元素尊重周围的空格（遵循标准的空格折叠规则）。如果使用

inline block

呈现元素会导致元素周围出现明显的间隙，请确保HTML中的两个元素正好相对-如果有任何换行符或空格，它们将被web浏览器转换为间隙。

我在该页面上没有看到任何图库，它只是背景图像…谢谢，这部分解决了问题！剩下的是每行之间的空白。顺便说一句，我已经向非管理员打开了网站，所以你现在可以观看我正在谈论的页面。。href无法获得缩略图的大小，并与下一行产生了间隙。在没有访问页面本身的情况下进行尝试是很棘手的（上面的链接似乎仍然不起作用）。在这种情况下，我通常只使用Safari（或Chrome）开发工具修改CSS，直到它看起来符合我的要求。我刚刚打开了网站，所以第一篇文章中的链接现在可以正常工作了。

.thickbox.video {
text-decoration: none !important;
width: 96px !important;
height: 96px !important;
}
.video_container {
position: relative;
display: inline-block;
height: 96px !important;
width: 96px !important;
margin: 0 !important;
padding: 0 !important;
}
.play-icona {
position:absolute;
left:35%;
top:35%;
}