Adding Whitespace in Middle of Sentence

Question

In HTML5, how do you skip 5 spaces in a <div>? For example, how do you do this:

"Drumroll... [5 spaces] Something!"

<div>Drumroll... [5 spaces] Something!</div> just outputs "Drumroll... Something!"

There does not seem to be any tags such as <indent> that I have found to indent in the middle of a sentence.

&nbsp&nbsp&nbsp&nbsp&nbsp works, but is there a more efficient way? Such as...

<skip 10px></skip>

Specifically, I am looking for the solution to insert exactly 1,000 spaces easily, for example.

Answer 1

This is not perfectly five spaces, and I'm not sure if there's a way to do it without using five consecutive  s, but this will allow you to add a specifiable amount of space inline.

<p>Drumroll...<span style="margin-left:50px;"></span>something</p>

http://jsfiddle.net/5drHj/1/

Another option might be to use the <pre> tag...

<pre>Drumroll...     something</pre>

http://jsfiddle.net/5drHj/2/

If you do decide to use consecutive   you could use a javascript loop (or php loop for server side construction) to add the 1000  s

Edit: At the risk of losing my tick, I'd like to point out that the answer given by @vals is a third option, and perhaps the most elegant of the three.

Answer 2

No, there is no such element in HTML. Long ago, there was the nonstandard <spacer> tag, but it was abandoned. You are supposed to use CSS for things like this. Wrap some preceding text in a <span> element and set padding-left: 1.25em on it. Tune the value as needed. The width of a space depends on font but is on the average around 0.25em.

Answer 3

The question that you pose in the first half of the question (How to insert spaces easily), is achieved with the property:

white-space: pre;

It means that your text is pre-formatted, and the white spaces should stay as they are. Then just insert those spaces.

fiddle

If you want to insert 1000 spaces, then we are talking probably about alignment, and there is a huge amount of posibilities. (padding specified in em being the most obvious), but you should then give more details of your situation.