String formatting with CSS

Question

I have a string with multiple lines as below separated by multiple spaces (or sometimes with single space):

"word1   word2       word3   word4
 word5   word same6  word7   word8"

In my Javascript I am able to split using \n, but when I display the same in a CSS div, it ends up in a weird format:

"word1 word2 word3 word4 word5 word same6 word7 word8".

My CSS:

.block{
    color: #000;
    border: 1px solid #fff300;
    padding:8px;
    margin:4px;
    width:80%;
    display: block;
}

How can I format the string with CSS? The spacing is not uniform and there's no guarantee on the spacing between words (and a word can also have a single space).

is not clear what formatting you want can you show it?

stivlo
– stivlo

2011-09-29 15:55:42 +00:00
Commented Sep 29, 2011 at 15:55 — stivlo
– stivlo, Commented Sep 29, 2011 at 15:55

zzzzBov · Accepted Answer · 2011-09-29 15:56:03Z

4

in HTML white space is condensed unless the white-space style has been set to a different value.

You might want to add:

white-space: pre;
-or-
white-space: pre-wrap;
-or-
white-space: nowrap;

to get it formatted correctly.

answered Sep 29, 2011 at 15:56

zzzzBov

180k57 gold badges328 silver badges375 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

gilly3 · Accepted Answer · 2011-09-29 15:59:20Z

1

Use white-space: pre. That should do the trick.

answered Sep 29, 2011 at 15:59

gilly3

92.6k26 gold badges148 silver badges179 bronze badges

Collectives™ on Stack Overflow

String formatting with CSS

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related