css控制文本最后一行,使用CSS调整文本的最后一行

我有一个CSS帮助程序类,用于强制最后一行“文本”(或用于预期用法,内联块div)成为对齐对齐以及其余的人。使用CSS调整文本的最后一行

下面是我得到了代码:

.justify-all-lines

{

text-align: justify;

/* IE-only properties that make the :after below unnecessary (we need this because IE 6/7 don't support :after, though) but if they both apply it'll be fine */

-ms-text-justify: distribute-all-lines;

text-justify: distribute-all-lines;

}

.justify-all-lines > *:last-child:after

{

display: inline-block;

width: 100%;

content: 'hello';

}

.blocky

{

display: inline-block;

/* Make inline block work in IE 6/7 */

zoom: 1;

*display: inline;

}

这是为使用像这样:

There is stuff in here.
There is stuff in here.
There is stuff in here.
There is stuff in here.
There is stuff in here.
There is stuff in here.
There is stuff in here.
There is stuff in here.
There is stuff in here.
There is stuff in here.

但是,我看到了“你好”显示里面的最后一个“块状”而不是在最后的“块状”div之后。我究竟做错了什么?

+0

'.justify,全行> *:最后的孩子:后{/ *的东西对IE6/7 * /}'是奇数。 IE6不支持'>',IE6/7都不支持':last-child'或':after'。 –

+0

您目前正在测试哪些浏览器?你可以做一个[jsFiddle](http://jsfiddle.net/)演示显示问题? –

+0

@thirtydot我使用无点(http://www.dotlesscss.org/),这只是一个复制和粘贴异常,因为我为了这篇文章的目的将一个mixin转换为内联CSS。想象更多的人会比LESS更熟悉纯CSS。我会解决它。 ;) –