CODEWITHSUNDEEP
htmlxhtml
Ayoub M.
Ayoub M.

Reputation: 4808

tabulation spacing

is there an equivalent to the consoles special char '\t' in html ?

Upvotes: 22

Views: 104348

Answers (12)

Komarov Andrey
Komarov Andrey

Reputation: 11

i'am using that "pattern" for convert plain text to simple HTML output:

someString.toString().replaceAll("\r\n", "\n").replaceAll("\n", "\n<BR>\n").replaceAll("\t", "&nbsp;&nbsp;&nbsp;&nbsp;")

where "someString" is the source string we need to convert...

first... we convert all "\r\n" to "\n" (for Win and *nix format supporting), then converting "\n" and "\t" to HTML-like output

Upvotes: 0

Roshan Yadav
Roshan Yadav

Reputation: 143

You can use this code &#8287; to add a space in the html. For tab space use it 5 times or more.Check here: https://www.w3schools.com/charsets/tryit.asp?deci=8287&ent=ThickSpace

Upvotes: -1

samivic
samivic

Reputation: 1310

<p style="margin-left:2em"></p>

Upvotes: 2

ndrini
ndrini

Reputation: 103

It is used for other purposes (so we have to be aware of this) but a tab like space is shown in the terms and descriptions tags.

For instance here:

<dl>
  <dt>Coffee</dt>
  <dd>Black hot drink</dd>
  <dt>Milk</dt>
  <dd>White cold drink</dd>
</dl>

the code is shown as

Coffee

(space) Black hot drink

Milk

(space) White cold drink

So, if you need only one tab, you can fake html by using <dd> tag. The use of <dd> is another, as said,

HTML <dd> Tag A description list, with terms and descriptions: more information

but it works :D (only used once).

Upvotes: -3

Pedro Emilio Borrego Rached
Pedro Emilio Borrego Rached

Reputation: 316

if what you need is different levels of tabulation use list, and set the style: "list-style-type:none" www.w3schools.com/html/html_lists.asp

Upvotes: -1

AugustoM
AugustoM

Reputation: 444

I needed to tabulate a simple listing in html and used CSS to 'fake it', here is the code:

/*CSS classes*/
.text-tabs-1{float:left;}

.text-tabs-2{
    float:left;
    margin-left:190px;
    display:block;
    position:absolute;
}

.clearer{clear:both;}

<!--HTML-->

<p>
<span class="text-tabs-1"><strong>Some text</strong>:</span><span class="text-tabs-2">Some indented text.</span><br />
<span class="text-tabs-1"><strong>Some text</strong>:</span><span class="text-tabs-2">Some indented text.</span><br />
<span class="text-tabs-1"><strong>Some text</strong>:</span><span class="text-tabs-2">Some indented text.</span><br />
<span class="text-tabs-1"><strong>Some text</strong>:</span><span class="text-tabs-2">Some indented text.</span><br />
</p>

<div class="clearer"></div>

Upvotes: 2

oeai
oeai

Reputation: 471

i'm using "&emsp;" looks better than "&nbsp;&nbsp;"

Upvotes: 37

Roman Bekkiev
Roman Bekkiev

Reputation: 3118

Inside the <pre> tags you can use &#9; which is the unicode symbol of tabulation. But outside preformated section browser will show it as a space.

Upvotes: 10

strager
strager

Reputation: 90022

Use tables for table data.

There is no standard way to tabulate data without a table (either a real table using <table> or faking it with CSS display).

Upvotes: 10

Sampson
Sampson

Reputation: 268374

You could use CSS's text-indent rule to apply a pre-defined indentation to the first line of a textblock.

<p style="text-indent:20px;">Hello World. I'm indented 20px.</p>

Upvotes: 11

meder omuraliev
meder omuraliev

Reputation: 186582

Other than relying on non breaking spaces, you can use a literal tab character inside of pre element, or by specifying white-space:pre as such:

<p id="foo">tab     between</p>
<style>
p#foo {
    white-space:pre;
}

Upvotes: 4

Owen
Owen

Reputation: 919

Not that I know of, I usually use &nbsp; or pre elements.

Upvotes: 4

Related Questions