text-aign:justify 不足的地方 ..

阿飞i
  • 628

在项目用到了text-align:justify;
初识它好欢喜,什么margin,padding都他妈滚蛋. 小哥我一句话搞定。

可结果并不是太如意.

1.首先不太语义化(当然这个可有可无)
2.不满一行不会两端对齐(这个好解决加个伪类或者添加占位符)
3.上面个问题来了,加个伪类或者占位符的话使内容超过一行,不过随之而来的就是父元素的高多出一些像素来了. (这个问题还不知道如何解决,听说font-size:0可以解决,试了不管用。)
4.最后一行是个悲剧.都是循环出来的不知道有多少项目,最后一行显然不可能要两端对齐的效果,要左对齐. (还是添加占位符解决.一行-2=占位符的个数,方法很硬)

不过有个好处当项目display:inline-block有overflow:hidden或者为空的时候,它们始终都是底部对齐的.而不是margin-bottom对齐。

回复
阅读 1.8k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏