<style>
div{width:400px;} a{width:200px;padding:0px;margin:0px;border:none;display:inline-block}
</style>
<div>
<a href='#'>one</a>
<a href='#'>two</a>
</div>
?
大家看个例子
简单的写一下
现在不知道为什么出现不了代码编辑器
只能写写文本了。
?
我们会看到这么写的话两个A是不能处于同一行的。
换一种style的写法
<style>
div{width:400px;} a{width:200px;padding:0px;margin:0px;border:none;display:block;float:left;}
</style>
?
?
这样能够在同一行
我搜索问题原因，在一篇英文文章里面说是因为inline元素都会跟inline元素之间产生一个类似white-space的空隙
?
可以验证，通过设置a的不同背景色，然后加大div的宽度 当他们正好到同一行的时候，确实看到两个A之间有个空隙。
?
虽然这种说法我也赞同
?
但是我发现其中有一些我现在都无法解释的问题，如果有人知道可以告诉我一下。
?
就是在chrome中文版里面这个空隙将近是8px
而在chrome英文版里面却只是4px
这一点让我感觉太诡异了
然而还有一种使用inline-block但是不会出现空隙的做法
就是将html代码写成这样
?
<div> <a href='#'>one</a><a href='#'>two</a> </div>?
就是将两个A写在同一行，挨着写
难道说我们平时写的换行的写法就会引起一些浏览器的兼容问题？
还是说同一行的写法尽量使用float而不是inline-block？
这一点真的很希望有人能帮我详细解释一下，万分感谢