去除inline-block元素间距的方法

默认情况下几个inline-block元素排列在一起 中间会出现空白的间隙

html: 123</div>

<div>123</div>
	<div>123</div>
	<div>123</div>

css:

<pre name="code" class="css">div{
	display:inline-block;
	width:200px;
	height:200px;
	background:pink;
}

如何解决这个问题:

1.把标签连起来写

<span style="white-space:pre">	</span><div>123</div><div>
	123</div><div>
	123</div>

或者这样写

<span style="white-space:pre">	</span><div>123</div><div>123</div><div>123</div>

2.使用font-size:0

<span style="white-space:pre">	</span><div class="container">
		<div class="test">123</div>
		<div class="test">123</div>
		<div class="test">123</div>
	</div>

.test{
	display:inline-block;
	width:200px;
	height:200px;
	background:pink;
	font-size:16px;
}

.container{
	font-size:0;
	-webkit-text-size-adjust:none;
}