我对text-align有一个奇怪的问题:在元素继承了justify属性之后,左边没有工作.我甚至尝试使用!important关键字,它仍然无效.奇怪的是,如果我在Chrome中使用开发者模式,则表示text-align:left处于活动状态,text-align:justify处于非活动状态,但它不会渲染左对齐.
这是我的代码:https://jsfiddle.net/h0vx9sLc/3/(更新了小提琴“修复”)
body { width: 100px; }
p:nth-child(1) { }
p:nth-child(2) { text-align: justify; }
p>span { text-align: left !important; }
基于CSS优先级,理由属性的优先级确实不高于左边.我在Chrome,Firefox和IE中对此进行了测试,所有人都在做同样的事情.
以下是Chrome声明左侧属性处于活动状态的屏幕截图,但事实并非如此.
最佳答案
好吧,这是CSS的一个非常奇怪的属性.
我在这个问题的帮助下弄清楚了:text-align justify,cannot override
显然是一个内联元素IGNORES text-align CSS,但它可以使它们无效.所以我的SPAN继承了对齐,但CSS渲染IGNORES内联元素的文本对齐CSS.
要修复它,我添加display:inline-block;我的跨度.真的,真奇怪.
我不确定如何解决Chrome开发者问题.我想它应该在技术上是一个错误?