inline-block大家是怎么控制行距的?

2013-08-02 09:08:20 +08:00
 bombless
我有一个跨两行的inline-block元素列,高度都是一样的,第一行到第二行有一个行距似乎是个random value,既不是border也不是margin也不是padding。
我还以为是line-height的问题,结果把line-height设成0,这个行距还是有,把line-height设成和height一样,在Chrome/Firefox倒是正常了,在IE10又不对了。
7410 次点击
所在节点    CSS
12 条回复
jjplay
2013-08-02 09:12:23 +08:00
这种问题可能是两段代码书写时候 留下的回车 bom字节 引起的间距,清除下 或者不折行 ,还有种是图片外边留下的间隙 用font-size:0; 搞定
hourui
2013-08-02 11:43:09 +08:00
基本上我是把换行符干掉
tokki
2013-08-02 14:50:29 +08:00
用 letter-spacing 可以解决这个问题 在某些浏览器下这个数值还是不一定的

具体参考 http://purecss.io/ 他是使用inline-block做布局的

当初由于简单才用这个,最近感觉各种不完美
NemoAlex
2013-08-02 15:28:39 +08:00
没有看懂楼主的描述
66beta
2013-08-02 15:44:14 +08:00
@NemoAlex 楼主讲的应该是这个
口口口口口口口口口口口口口口口
你好,我是来恶心你的未知间隔
口口口口口口口口口口口口口口口
NemoAlex
2013-08-02 16:12:03 +08:00
@66beta 如果是这个问题,简单把父元素的 line-height 或者 font-size 设为0就可以了
感觉楼主说的是更复杂的问题
P233
2013-08-02 19:10:39 +08:00
switch
2013-08-02 20:00:19 +08:00
楼主说的是行距,而不是字(空白)距,这里可以试着设置 vertical-align + line-height。
PS:字体也可能会影响到设置。
bombless
2013-08-16 00:00:49 +08:00
@tokki 谢谢,我多研究研究!

inline-block估计是有点坑,刚刚看到它的关于baseline的问题。
http://www.zhihu.com/question/21431313
@switch谢谢! 是的,字号我忘调了,也可能是字号的问题。
pertersonvv
2014-12-24 17:51:03 +08:00
@tokki 它和BootStrap有啥区别?
tokki
2014-12-24 18:18:28 +08:00
@pertersonvv 这个简单啊 5.0了 感觉还不错
pertersonvv
2014-12-25 01:12:42 +08:00
@tokki 不是说bs很简单么?pure更简单?

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/77730

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX