删除溢出的行内元素行之间的边距 [英] Remove margin between rows of overflowing inline elements

问题描述

我正在创建一个基于图块的游戏，并使用块渲染来更新大量的图块列表。我试图以最简单的方式这样做，所以我一直在试图使用HTML的默认布局。现在我正在创建'inline-blocks'，省略元素之间的空格，以避免它们之间的水平空间，但是当块溢出并创建一个新行时，有一些垂直边距，我不知道如何删除。 / p>

让这个更清楚的例子：
http://jsfiddle.net/mLa93/13/

（很多我只需要删除块行之间的间距，同时保留简单的标记。）

解决方案

为了尽可能使代码尽可能接近：

http://jsfiddle.net/mLa93/20/ p>

• 将 line-height：0 添加到 #container 。


• 添加黑客以使 display：inline-block 在IE7中工作。

I'm creating a tile-based game and am using block rendering to update a large list of tiles. I'm attempting to do this in the most simple manner, so I've been trying to work with HTML's default layouts. Right now I'm creating 'inline-blocks', omitting whitespace between the elements to avoid horizontal spaces in between them but when the blocks overflow and create a new line there is some vertical margining in which I do not know how to remove.

Example to make this a bit clearer: http://jsfiddle.net/mLa93/13/

(Pretty much I just need to remove the spacing between the block rows while retaining the simple markup.)

解决方案

In the effort of keeping your code as close as possible to how it was:

http://jsfiddle.net/mLa93/20/

• Add line-height: 0 to #container.
• Add the hacks to make display: inline-block work in IE7.

这篇关于删除溢出的行内元素行之间的边距的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！