Justify pre-packaged content
In Firefox, how can you justify text with a white-space: pre-wrap;
CSS attribute ?
I need the pre-wrap
browser to not crash whitespace, but it breaks the property text-align: justify;
. For example http://jsfiddle.net/xpp48knq/ .
I would be fine with any solution that doesn't collapse whitespace and that justifies the content.
+3
source to share
1 answer
Here are some ways to solve ur problem.
U should remove the "white space: pre-wrap" from the element and replace all spaces in the text with "" (zero-width middle space plus space). And everything will work well in every major browser.
Here's an example: https://jsfiddle.net/gvm3x354/
<div id='output' class='text'>
</div>
.text {
border: 1px solid black;
text-align: justify;
width: 200px;
height: auto;
}
var output = document.getElementById('output'),
text = 'I\'m a justified text with multiple spaces between words. Really cool, so js. Found better workaround? E-mail me!';
text = text.replace(/\s/g, '​ ');
output.innerHTML = text;
-1
source to share