Html 文本对齐对齐不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6228347/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
text-align justify not working
提问by phil
I'm trying to justify the text within this p tag so that it perfectly fits the width of the p.
我试图调整这个 p 标签内的文本，使其完全适合 p 的宽度。
<p align="justify" style="text-align: justify !important; color:#fff; margin:0px; font-weight:bold; width:487px; border:Solid 1px red;">blah blah blah</p>
but the text just wont justify! any idea why?
但文字只是不会证明！知道为什么吗？
thanks for any help.
谢谢你的帮助。
回答by manafire
You can use the solution described here: http://blog.vjeux.com/2011/css/css-one-line-justify.html
您可以使用此处描述的解决方案：http: //blog.vjeux.com/2011/css/css-one-line-justify.html
This will justify a single line but adds a space after, so if you know the height, you can specify it with overflow:hiddento conceal it and still get the justification.
这将使单行对齐但在其后添加一个空格，因此如果您知道高度，则可以指定它overflow:hidden以隐藏它并仍然获得对齐。
.fulljustify {
text-align:justify;
}
.fulljustify:after {
content: "";
display: inline-block;
width: 100%;
}
#tagline {
height: 80px;
overflow: hidden;
line-height: 80px; /* vert-center */
}<p id="tagline" class="fulljustify">Blah blah blah</p>回答by Brett
If your text doesn't span more than one line, justifying doesn't do anything. Your text has to wrap to the next line, and then the FIRST line will be justified, but not the second.
如果您的文本不超过一行，则对齐没有任何作用。您的文本必须换行到下一行，然后第一行将是合理的，但不是第二行。
回答by alijsh
Chrome doesn't support it but in Firefox and IE, you can use text-align-last: justify;. For a cross-browser solution, we have to use what @onemanarmy posted ;)
Chrome 不支持它，但在 Firefox 和 IE 中，您可以使用text-align-last: justify;. 对于跨浏览器解决方案，我们必须使用@onemanarmy 发布的内容；)
回答by Jason Gennaro
If you wanted to justify four words in 487pxyou could try using word-spacingin your css.
如果你想证明四个单词的合理性，487px你可以尝试word-spacing在你的css.
I used word-spacing:8em;for bla bla bla blabut you could adjust as necessary.
我使用过word-spacing:8em;，bla bla bla bla但您可以根据需要进行调整。
回答by venkat
try this
尝试这个
for div
对于 div
div {
text-align:justify;
text-justify: inter-word;
text-align-last:center;
/* for IE9 */
-ms-text-align-last:center;
}
回答by WoodyDRN
There is also something similar, like display: flex; justify-content: space-around; if you would wrap those texts in spans or divs
还有类似的东西，比如 display: flex; justify-content: 空间环绕；如果您将这些文本包装在跨度或 div 中
回答by Navruz Madibragimov
In my case for < p > tag, works with easy way:
在我的 < p > 标签的情况下，使用简单的方法：
p {
text-align: justify;
text-justify: inter-word;
}
回答by Waelmas
To make it look good on Chrome & opera (multiline justify looks bad on them)
为了让它在 Chrome 和歌剧上看起来不错（多行对齐在他们身上看起来很糟糕）
I use the following
我使用以下
.fulljustify {
text-align: justify;
display: table-row;
text-align-last: left;
}
回答by Vengadesh Balu
You better try
你最好试试
style="text-align:justifty;display:inline-block;"
回答by S.K. Dhanda
Just use style="text-align:justify".
It works in all browsers.
只需使用style="text-align:justify".
它适用于所有浏览器。
