删除溢出的内联元素行之间的边距
我正在创建一个基于图块的游戏，并使用块渲染来更新大量图块列表。我试图以最简单的方式做到这一点，所以我一直在尝试使用 HTML 的默认布局。现在我正在创建“内联块”，省略元素之间的空白以避免它们之间的水平空间，但是当块溢出并创建新行时，会有一些垂直边距，我不知道如何删除。
让这一点更清楚一点的示例： http://jsfiddle.net/mLa93/13/
（几乎我只需要删除空格在块行之间，同时保留简单标记。）
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.)
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
为了使您的代码尽可能接近原来的样子：
http://jsfiddle.net/mLa93/ 20/
line-height: 0添加到#container。display: inline-block在 IE7 中正常工作。In the effort of keeping your code as close as possible to how it was:
http://jsfiddle.net/mLa93/20/
line-height: 0to#container.display: inline-blockwork in IE7.使用 display: block 并设置 float: left。看看这个叉子：
http://jsfiddle.net/q5eSG/
Use display: block and set float: left. See this fork:
http://jsfiddle.net/q5eSG/
无需使用
display: inline-block，只需浮动div元素即可。然后，您只需要清除
#container元素上的浮动，我使用overflow: hide;来执行此操作，请查看工作示例：http://jsfiddle.net/Ymz3m/
Instead of using
display: inline-block, simply float thedivelements.Then, you just need to clear the floats on your
#containerelement, which I do so usingoverflow: hidden;Check out the working example: http://jsfiddle.net/Ymz3m/