179

In HTML, there is no character for a tab, but I am confused as to why I can copy and paste one here: " " (You can't see the full width of it, but if you click to edit my question, you will see the character.) If I can copy and paste a tab character, there should be a unicode equivalent that can be coded into html. I know it doesn't exist, but this is a mystery I've never been able to grasp.

So my question is: why is there not a unicode character for a tab even if I can copy and paste it?

MestreLion
  • 12,698
  • 8
  • 66
  • 57
Abbey Graebner
  • 1,837
  • 2
  • 11
  • 8
  • 49
    Here is a tab character for you: " ". Just text me if you need other characters! I have spaces, dashes and Greek letters as well! – madhead Mar 28 '19 at 15:48
  • 1
    On Unix: Ctrl+Shift+U and then 9 for indent character. – neverMind9 May 01 '19 at 00:50
  • StackOverflow munges comment text more severely than questions or answers. ` `, ' ', and " " _were_ pasted TAB characters, quoted various ways. – MarkHu May 07 '20 at 20:57

7 Answers7

226

Sure there's an entity for tabs:

	

(The tab is ASCII character 9, or Unicode U+0009.)

However, just like literal tabs (ones you type in to your text editor), all tab characters are treated as whitespace by HTML parsers and collapsed into a single space except those within a <pre> block, where literal tabs will be rendered as 8 spaces in a monospace font.

Daniel
  • 4,525
  • 3
  • 38
  • 52
josh3736
  • 139,160
  • 33
  • 216
  • 263
  • 1
    That's interesting, but if it is a unicode character, then html shouldn't be changing it (collapsing it) at all, should it? – Abbey Graebner Mar 12 '12 at 02:26
  • 2
    Unicode doesn't have its own tab character; U+0009 is the same as the tab character you get by pressing `Tab`. (I think you might be confusing HTML entities with the Unicode character set.) – josh3736 Mar 12 '12 at 02:35
  • 11
    more generally you can use in any element with CSS style white-space:pre; like in http://jsfiddle.net/cancerbero_sgx/sp269/3/ – cancerbero Dec 06 '13 at 01:02
  • is not working in markdown file, fyi – Mario Petrovic Mar 31 '23 at 09:55
143

Try &emsp;

as per the docs :

The character entities &ensp; and &emsp; denote an en space and an em space respectively, where an en space is half the point size and an em space is equal to the point size of the current font. For fixed pitch fonts, the user agent can treat the en space as being equivalent to A space character, and the em space as being equuivalent to two space characters.

Docs link : https://www.w3.org/MarkUp/html3/specialchars.html

Nisse Engström
  • 4,738
  • 23
  • 27
  • 42
Abhishek Goel
  • 18,785
  • 11
  • 87
  • 65
61

put it in between <pre></pre> tags then use this characters &#9;

it would not work without the <pre></pre> tags

Raymund
  • 7,684
  • 5
  • 45
  • 78
  • 6
    Okay, this is great, I was trying to use ` ` by itself, but it didn't work. Thanks for mentioning `
    `!
     – Abbey Graebner Mar 12 '12 at 02:30
  • 3
    Excellent suggestion. Why exactly does it behave like this? – pkanane Aug 04 '15 at 09:04
  • 3
    the 
     tag defines preformatted text any text place inside the tag will preserve spaces, line breaks, tab etc.  It usually will be displayed in a fixed width font type like Courier
     – Raymund Aug 05 '15 at 04:16
  • 3
    You can use any html tag with combination of `white-space: pre-wrap;` or `white-space: pre;` – Petr Hurtak May 03 '18 at 08:49
22

Posting another alternative to be more complete. When I tried the "pre" based answers, they added extra vertical line breaks as well.

Each tab can be converted to a sequence non-breaking spaces which require no wrapping. 

"&nbsp;&nbsp;&nbsp;&nbsp;"

This is not recommended for repeated/extensive use within a page. A div margin/padding approach would appear much cleaner.

crokusek
  • 5,345
  • 3
  • 43
  • 61
  • 8
    If tabs are being used as a tool for aligning the text to the right of the tabs (where the non-fixed width font text on the left are not equal), converting to nbsp chars won't solve the problem. – Steve Midgley Apr 25 '17 at 14:48
7

I use <span style="display: inline-block; width: 2ch;">&#9;</span> for a two characters wide tab.

GrayFace
  • 1,224
  • 10
  • 13
  • 1
    This isn't the same as tabs, it's just adding white space so there's no columns with this. – Salami Dec 26 '18 at 03:15
2

Tab is [HT], or character number 9, in the unicode library.

DanRedux
  • 9,119
  • 6
  • 23
  • 41
1

As mentioned, for efficiency reasons sequential spaces are consolidated into one space the browser actually displays. Remember what the ML in HTML stand for. It's a Mark-up Language, designed to control how text is displayed.. not whitespace :p

Still, you can pretend the browser respects tabs since all the TAB does is prepend 4 spaces, and that's easy with CSS. either in line like ...

 <div style="padding-left:4.00em;">Indenented text </div>

Or as a regular class in a style sheet

.tabbed {padding-left:4.00em;}

Then the HTML might look like 

<p>regular paragraph regular paragraph regular paragraph</p>
<p class="tabbed">Indented text Indented text Indented text</p>
<p>regular paragraph regular paragraph regular paragraph</p>
Duane Lortie
  • 1,285
  • 1
  • 12
  • 16
  • 5
    That's not what a tab does. Tabs line up content, -- on one row it might add 3 spaces and on another 4. Conceptually, it moves the cursor to the next tab stop. – BrainSlugs83 Nov 21 '19 at 01:09