inline-block 间距问题

• 请不要在回答技术问题时复制粘贴 AI 生成的内容

This topic created in 4312 days ago, the information mentioned may be changed or developed.

假设一行inline-block元素之间间距是固定的，像这样
http://jsfiddle.net/LYUt6/
是不是只能用每个元素设margin-right、再让最后一个元素margin-right为0这种比较丑的方法？
之前还试过word-spacing，但很诡异，有有经验的能解释一下吗

11 replies • 2014-07-21 21:11:44 +08:00

jsonline

Jul 21, 2014 via Android

间距跟 font size 有关，设置为0见没间距了。

zythum

Jul 21, 2014

最好的方法就是写html的时候中间不要带空格，回车，换行什么的就行了。

jarlyyn

Jul 21, 2014

这个不是应该每个元素加两边margin/padding.
然后外框元素设负数左右margin么……

sneezry

Jul 21, 2014

我的想法和楼主差不多，只是经常用:last-child伪类

jakwings

Jul 21, 2014

还可以用 .wrapper > div:last-child
不用正规方法怎么写都是丑。

node

Jul 21, 2014

多谢大家给意见，这下有点感觉了

@jsonline 明白了，设了font-size: 0 之后就好了 :)

@jarlyyn 外框设负数margin真的可以奏效吗？试了一下好像没有成功

foomorrow

Jul 21, 2014

letter-spacing:-.31em;

來自purecss的解決方案

ttph1oc

Jul 21, 2014

所有用CSS的方法都属于hack，最好是用个模板引擎，后端自动删输出的换行和空格。

Mutoo

Jul 21, 2014

刚好看到这篇文章 inline-block 的前世今生 http://ued.taobao.com/blog/2012/08/inline-block/

hidoos

Jul 21, 2014

父元素设置font-size为0，不过一定要记得为子元素添加font-size，不然文字就看不见；
另外，一丝写的inline-block的前世今生那篇真的不错可以看看。inline-block这个间距是正常的，不是bug。

Biwood

Jul 21, 2014

如果是因为文本空格导致的间隔，用margin-right根本没作用好吧，父元素font-size为0倒是可以解决