\t is not working in JavaScript [closed]

StackOverflow https://stackoverflow.com/questions/22670210

  •  22-06-2023
  •  | 
  •  

Question

I am trying to just use a \t between 2 text but the \t tab is not working and no space is given between the 2 text. I tried to just use spacing and that doesn't work too. Anything more than 1 space seems to get trimmed.

I looked around here and most are saying javascript does auto trim thus tab and extra spacing doesn't work. Another is that it is not recognized in certain browsers. I am using Chrome.

Having come across the above replies, I didn't see any solutions. Is there a way around to disable the auto trim? Thanks.

Was it helpful?

Solution

HTML trims whitespace down to 1, not JS. You can change this behavior with CSS. Set white-space: pre for it to respect all whitespace and line breaks in the text.

http://www.w3schools.com/cssref/pr_text_white-space.asp

OTHER TIPS

Using \t in a string literal in JavaScript produces the tab character, U+0009 : CHARACTER TABULATION. There is no problem with this as such. But the tab is by definition a whitespace character in HTML, and in any normal content, any sequence of whitespace characters is equivalent to a space.

In some contexts, however, the tab causes tabbing, with tab stop set at every 8 characters, which is normally inappropriate. There are CSS settings to set tab stops, but browser support is limited.

The contexts where tab causes tabbing are pre elements (by definition), textarea elements (in practice), and elements with white-space: pre set on them. But in order to make sense, tabbing also requires that font is monospace.

In almost all imaginable situations, you should use tools other than tab characters, such as HTML tables. But since no specific context and purpose was described, it is impossible to give a specific suggestion.

The tab will work in JavaScript itself. If you see the code executed in a console, most, if not every browser will display as many tabs as you wish.

You're probably printing this in HTML, which ignores multiple whitespace characters unless they're explicitly printed as   character entities.

For more information on how to print it in HTML, see this question

Alternatively, you can alter this behaviour for a set of elements using the CSS white-space property

.div1{
  background-color:#27AE60;
  width:80%;
  height:200px;
  margin:auto;
  border-radius:15px;
}
h1{
  color:white;
  font-size:18px;
  font-weight:bold;
  font-family:'Roboto slab';
  text-align:center;
  padding-top:10px;
}
p{
  color:white;
  font-size:15px;
  font-weight:normal;
  text-align:center;
  padding-top:40px;
}
<html>
  <head>
  <title>wsdfa</title>
  </head>
  <body>
    <div class="div1">
     <h1> HELLO WORLD</h1>
      <p>This is my first page of HTML CSS</p>
    </div>
  </body>
</html>

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top