Tab space instead of multiple non-breaking spaces nbsp

Question

Is it possible to insert a tab character in HTML instead of having to type  amp nbsp  four times

User · Answer

It s better to use the pre tag  The pre tag defines preformatted text    lt pre gt   This is preformatted text  It preserves      both spaces  and line breaks    lt  pre gt    know more about pre tag at this link

User · Answer

If you needed only one tab  the following worked for me    lt style gt     tab       position  absolute      left  10em        lt  style gt    with the HTML something like    lt p gt  lt b gt asdf lt  b gt   lt span class  tab  gt 99967 lt  span gt  lt  p gt   lt p gt  lt b gt hjkl lt  b gt   lt span class  tab  gt 88868 lt  span gt  lt  p gt     You can add more  tabs  by adding additional  tab  styles and changing the HTML such as    lt style gt     tab       position  absolute      left  10em          tab1       position  absolute      left  20em        lt  style gt    with the HTML something like    lt p gt  lt b gt asdf lt  b gt   lt span class  tab  gt 99967 lt  span gt  lt span class  tab1  gt hear lt  span gt  lt  p gt   lt p gt  lt b gt hjkl lt  b gt   lt span class  tab  gt 88868 lt  span gt  lt span class  tab1  gt here lt  span gt  lt  p gt

User · Answer

If you are using CSS  I would suggest the following   p first-letter       text-indent 1em     This will indent the first line like in traditional publications

User · Answer

It s much cleaner to use CSS  Try padding-left 5em or margin-left 5em as appropriate instead

User · Answer

You can also use   p  before       content          padding-left  30px      And replace  p  with any other selector you have in mind

User · Answer

There really isn t any easy way to insert multiple spaces inside  or in the middle  of a paragraph  Those suggesting you use CSS are missing the point  You may not always be trying to indent a paragraph from a side but  in fact  trying to put extra spaces in a particular spot of it   In essence  in this case  the spaces become the content and not the style  I don t know why so many people don t see that  I guess the rigidity with which they try to enforce the separation of style and content rule  HTML was designed to do both from the beginning - there is nothing wrong with occasionally defining style of an unique element using appropriate tags without having to spend a lot more time on creating CSS style sheets and there is absolutely nothing unreadable about it when it s used in moderation  There is also something to be said for being able to do something quickly   translates to how they can only consider whitespace characters as being used only for style and indentation   And when there is no graceful way to insert spaces without having to rely on  amp emsp  and  amp nbsp  tags  I would argue that the resulting code becomes far more unreadible than if there was an appropriately named tag that would have allowed you to quickly insert a large number of spaces  or if  you know  spaces weren t needlessly consumed in the first place    As it is though  as was said above  your best bet would be to use  amp emsp  to insert  emsp  in the correct place

User · Answer

You can use a table and apply a width attribute to the first  lt td gt       Code     lt table gt       lt tr gt           lt td width  100  gt Content1 lt  td gt           lt td gt Content2 lt  td gt       lt  tr gt       lt tr gt           lt td gt Content3 lt  td gt           lt td gt Content4 lt  td gt       lt  tr gt   lt  table gt       Result   Content1       Content2 Content3       Content4

User · Answer

There is a simple css for it   white-space  pre    It keeps the spaces that you add in the HTML rather than unifying them

User · Answer

I have used a span with in line styling   I have had to do this as I as processing a string of plain text and need to replace the  t with 4 spaces  appx    I couldn t use  amp nbsp  as further on in the process they were being interpreted so that the final mark up had non-content spaces   HTML    lt span style  padding  0 40px  gt  amp nbsp  lt  span gt    I used it in a php function like this    message   preg replace    t      lt span style  padding  0 40px  gt  amp nbsp  lt  span gt     message

User · Answer

Only  pre  tag    lt pre gt Name       Waleed Hasees Age         33y Address     Palestine   Jein lt  pre gt    You can apply any CSS class on this tag

User · Answer

Well  if one needs a long whitespace in the beginning of one line only out of the whole paragraph  then this may be a solution    lt span style  display inline-block height 1em width 4em   gt  amp nbsp  lt  span gt    If that is too much to write or one needs such tabs in many places  then you can do this   lt span class  tab  gt  amp nbsp  lt  span gt    Then include this into CSS   span tab  display inline-block height 1em width 4em

User · Answer

No  Tab is just whitespace as far as HTML is concerned  I d recommend an em-space instead which is this big     emsp        typically 4 spaces wide     and is input as  amp emsp     You might even be able to get away with using the Unicode character       for it  if you re lucky    Here is a list of Space characters and    zero-width spaces    in Unicode

User · Answer

If you re looking to just indent the first sentence in a paragraph  you could do that with a small CSS trick   p first-letter       margin-left  5em

User · Answer

amp emsp    amp ensp    amp  8195  or  amp  8194  can be used    W3 says      The character entities  amp ensp  and  amp 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     Read More at W3 org for HTML3  Read More at W3 org for HTML4  Even more at Wikipedia

User · Answer

we can use style  white-space pre  like this    lt p gt Text lt tab style  white-space pre  gt          lt  tab gt   value lt  p gt   lt p gt Text2 lt tab style  white-space pre  gt     lt  tab gt   value2 lt  p gt   lt p gt Text32 lt tab style  white-space pre  gt    lt  tab gt   value32 lt  p gt    the blank space inside  is filled with tabs  the amount of tabs is depend on the text   it will looks like this   Text      value Text2     value2 Text32    value32

User · Answer

The  ampnbsp  unit is font size dependent  To understand that dependency  consider em and rem units of measure  using this CSS HTML method   CSS   tab   margin-left  1rem      HTML   lt div class    tab gt     p and h elements     lt  div gt    DISPLAY  1em approximately equals 4  amp nbsp  but  amp nbsp  em unit and  ampnbsp  rem unit display depend on element and style use  indenting something like this   --------h1 indented 1em --p indented 1em ----h1 indented 1rem ----p indented 1rem   Both margin-left and padding-left work  There is no tab unit of length in HTML or CSS  A  tab class selector can be used

User · Answer

The ideal CSS code that should be used should be a combination of  display  and  min-width  properties     display  inline-block  min-width  10em        for example  depending on the uniform width to be achieved for the items  in a list   which is a common scenario where tab is often needed

User · Answer

This is not a direct answer but I wanted to add a tab in Markdown document   I was drawing an object graph like this   --Parent             Child 1   Of course the easy way it to mark it as code by indenting by 4 spaces and is then treated as code in Markdown       --Parent                     Child 1

User · Answer

Using CSS and best practice  the dynamic creation of nested  indented menus would be as follows    Create a style for each nesting  such as indent1  indent2 etc  with each specifying its own left margin  Site structure should rarely go beyond three levels of nesting  Use a static variable  integer  within the self-recursive function to track the recursion  For each loop  append the loop number to the word indent  using server side scripting such as PHP or ASP  so that these menus are formatted appropriately by CSS    Alternatively  loop through the static variable to add spacing using multiple  amp nbsp  or  lt pre gt  tags  or other characters  as appropriate   From testing the horizontal tab character   amp  09  I found that it doesn t work as a replacement to multiple  amp nbsp  in the scenario I described  You may have different results

User · Answer

Try  amp emsp   It is equivalent to four  amp nbsp s

User · Answer

This is a bit of an ugly solution but you could just do this  var tab     amp nbsp  amp nbsp  amp nbsp  amp nbsp      And then use the tab variable in your strings

User · Answer

I use a list with no bullets to give the  tabbed  appearance   It s what I sometimes do when using MS Word   In the CSS file    tab       margin-top  0px      margin-bottom  0px      list-style-type  none      And in the HTML file use unordered lists   This is normal text  lt ul class  tab  gt       lt li gt This is indented text lt  li gt   lt  ul gt    The beauty of this solution is that you can make further indentations using nested lists   A noob here talking  so if there are any errors  please comment

User · Answer

AFAIK  the only way is to use   amp nbsp    If you can use CSS then you can use padding or margin  See Box model  and for Internet nbsp Explorer  also read Internet Explorer box model bug

User · Answer

CSS   lt html gt   lt head gt   lt style gt      tab before               content    00a0 00a0 00a0 00a0          lt  style gt   lt  head gt    HTML   lt body gt       lt tab gt   include  amp lt  stdio h  amp gt   lt br gt       lt tab gt   lt br gt       lt tab gt  int main  void   lt br gt       lt tab gt     lt br gt       lt tab gt   lt tab gt  printf   Hello  World      lt br gt       lt tab gt   lt tab gt  return 0   lt br gt       lt tab gt     lt br gt   lt  body gt   lt  html gt    Rendered

User · Answer

Below are the 3 different ways provided by HTML to insert empty space    Type  amp nbsp  to add a single space   Type  amp ensp  to add 2 spaces  Type  amp emsp  to add 4 spaces

User · Answer

If whitespace becomes that important  it may be better to use preformatted text and the  lt pre gt  tag

User · Answer

It depends on which character set you want to use    There s no tab entity defined in ISO-8859-1 HTML - but there are a couple of whitespace characters other than  amp nbsp  such as  amp thinsp    amp ensp  and  amp emsp    In ASCII   amp  09  is a tab   Here is a complete listing of HTML entities and a useful discussion of whitespace on Wikipedia

User · Answer

lt span style  margin-left 64px  gt  lt  span gt      Consider it like this  one tab is equal to 64 pixels  So this is the space we can give by CSS

User · Answer

I would simply recommend      In your CSS code     pre       display inline      lt  -- And then  in your HTML code  -- gt    lt pre gt     This text comes after four spaces  lt  pre gt   lt span gt  Continue the line with other element without braking  lt  span gt

User · Answer

amp emsp  is the answer     However  they won t be as functional as you might expect if you are used to using  horizontal tabulations in word-processors e g  Word  Wordperfect  Open Office  Wordworth  etc  They are fixed width  and they cannot be customised   CSS gives you far greater control and provides an alternative until the W3C provide an official solution   Example   padding-left 4em      or    margin-left 4em      as appropriate  It depends on which character set you want to use   You could set up some tab tags and use them similar to how you would use h tags    lt style gt      tab1   padding-left  4em        tab2   padding-left  8em        tab3   padding-left  12em        tab4   padding-left  16em        tab5   padding-left  20em        tab6   padding-left  24em        tab7   padding-left  28em        tab8   padding-left  32em        tab9   padding-left  36em        tab10   padding-left  40em        tab11   padding-left  44em        tab12   padding-left  48em        tab13   padding-left  52em        tab14   padding-left  56em        tab15   padding-left  60em        tab16   padding-left  64em     lt  style gt       and use them like so    x000D   x000D   lt  DOCTYPE html gt  x000D   x000D   lt html gt  x000D       lt head gt  x000D           lt meta http-equiv  Content-Type  content  text html  charset utf-8    gt  x000D           lt title gt Tabulation example lt  title gt  x000D   x000D           lt style type  text css  gt  x000D              dummydeclaration   padding-left  4em       Firefox ignores first declaration for some reason    x000D              tab1   padding-left  4em    x000D              tab2   padding-left  8em    x000D              tab3   padding-left  12em    x000D              tab4   padding-left  16em    x000D              tab5   padding-left  20em    x000D              tab6   padding-left  24em    x000D              tab7   padding-left  28em    x000D              tab8   padding-left  32em    x000D              tab9   padding-left  36em    x000D              tab10   padding-left  40em    x000D              tab11   padding-left  44em    x000D              tab12   padding-left  48em    x000D              tab13   padding-left  52em    x000D              tab14   padding-left  56em    x000D              tab15   padding-left  60em    x000D              tab16   padding-left  64em    x000D   x000D           lt  style gt  x000D   x000D       lt  head gt  x000D   x000D       lt body gt  x000D           lt p gt Non tabulated text lt  p gt  x000D   x000D           lt p gt  lt tab1 gt Tabulated text lt  tab1 gt  lt  p gt  x000D           lt p gt  lt tab2 gt Tabulated text lt  tab2 gt  lt  p gt  x000D           lt p gt  lt tab3 gt Tabulated text lt  tab3 gt  lt  p gt  x000D           lt p gt  lt tab3 gt Tabulated text lt  tab3 gt  lt  p gt  x000D           lt p gt  lt tab2 gt Tabulated text lt  tab2 gt  lt  p gt  x000D           lt p gt  lt tab3 gt Tabulated text lt  tab3 gt  lt  p gt  x000D           lt p gt  lt tab4 gt Tabulated text lt  tab4 gt  lt  p gt  x000D           lt p gt  lt tab4 gt Tabulated text lt  tab4 gt  lt  p gt  x000D           lt p gt Non tabulated text lt  p gt  x000D           lt p gt  lt tab3 gt Tabulated text lt  tab3 gt  lt  p gt  x000D           lt p gt  lt tab4 gt Tabulated text lt  tab4 gt  lt  p gt  x000D           lt p gt  lt tab4 gt Tabulated text lt  tab4 gt  lt  p gt  x000D           lt p gt  lt tab1 gt Tabulated text lt  tab1 gt  lt  p gt  x000D           lt p gt  lt tab2 gt Tabulated text lt  tab2 gt  lt  p gt  x000D   x000D       lt  body gt  x000D   x000D   lt  html gt  x000D   x000D   x000D    Run the snippet above to see a visual example   Extra discussion  There are no horizontal tabulation entities defined in ISO-8859-1 HTML  however there are some other white-space characters available than the usual  amp nbsp  for example   amp thinsp    amp ensp  and the aforementioned  amp emsp    It s also worth mentioning that in ASCII and Unicode   amp  09  is a horizontal tabulation

User · Answer

we use custom space span class   lt span class  space  gt  lt  span gt    Include space class in CSS    space       margin-left 45px

User · Answer

The  lt tab gt  tag never made it into browsers  despite being introduced in HTML3  I ve always thought it a real pity because life would be much easier in many circumstances if we had it available to us  But you can easily remedy this to give you a fake  lt tab gt  tag  Add the following in the head of your HTML or else  without the style tags  into your CSS    lt style gt      tab   padding-left  4em     lt  style gt    From then on  when you need a tab in your document put  lt tab gt  in there  It isn t a true tab because it doesn t align to tab-marks  but it works for most needs  without having to dither around with clumsy character entities or spans  It makes it really easy to check your source  and a cinch to format simple things where you don t want to go to the hassle of tables or other more complex  solutions    One nice aspect of this solution is that you can do a quick search replace of a text document to replace all TABs with the  lt tab gt  tag   You might be able to define a bunch of true absolute position TABs  then use the appropriate tab  e g   lt tab2 gt  or  lt tab5 gt  or whatever  where needed  but I haven t found a way to do that without it indenting subsequent lines

User · Answer

lt head gt   lt style gt  t  color         letter-spacing 35px    lt  style gt   lt  head gt    lt t gt   lt  t gt    Make sure the color code matches the background the px is variable to desired length for the tab   Then add your text after the  lt  t    lt   t     The period is used as a space holder and it is easier to type  but the   amp   160   can be used in place of the period also making it so the color coding is irrelative     lt head gt   lt style gt  t  letter-spacing 35px    lt  style gt   lt  head gt    lt t gt  amp  160  lt  t gt    This is useful mostly for displaying paragraphs of text though may come in useful in other portions of scripts

User · Answer

I came across this while searching for a method and ended up figuring out my own that seems to work easily for what s wanted  I m new to posting here so I hope this works    But have this in CSS   span tab      padding  0 80px     Or desired space       Then in your HTML have this be your  long tab  in mid sentence like I needed    lt span class  tab  gt  lt  span gt    Saves from the amount of  amp nbsp  or  amp emsp  that you d need   Hope this helps someone  cheers

[html] Tab space instead of multiple non-breaking spaces ("nbsp")?

Examples related to html