Science Library - free educational site

Text Formatting

In HTML5, the default character encoding is UTF-8, replacing the HTML 4.01 ISO-8859-1 standard, and Window's ANSI (ISO-8859-1 with 32 extra characters). All standards prior to Unicode were limited and contained a cultural/linguistic bias, not suitable to multilingual environments.

The Unicode Standard is default for HTML5, and covers all the characters, punctuations and symbols in the world.

Conclusion: use HTML5 and Unicode! accept-charset does not need to be declared specifically.

UTF-8 and UTF-16

UTF-8 is a standard which covers all characters, punctuation marks and symbols, of all languages. Each character is 1-4 bytes long. It is backwards compatible with previous standards, such as ASCII (the ye olde 256 character code from the card-punching age).

UTF-16 is a 'Transformation Format'. This is a variable-length character encoding, and is used in operating systems (Windows, .NET, Java).

Compatibility: HTML4 supports UTF-8 only. HTML5 supports both UTF-8 and UTF-16.

the <pre> tag

Sometimes it is desired to override the HTML default layout rules. For example, a double space in the code is interpreted as a single space, and a line break as an 'Enter' key stroke in the code is ignored.

To compel HTML to interpret all strokes, the <pre> tag is used:

<pre>

n = 0          1

n = 1         1   1

n = 2       1   2   1

n = 3      1   3   3   1

n = 4    1   4   6   4   1

n = 5   1   5   10   10   5   1

</pre>

The code in the example above is entered in the text editor with carriage spaces and enter returns for line breaks. Without the <pre> tags, the above code results in:

n = 0 1 n = 1 1 1 n = 2 1 2 1 n = 3 1 3 3 1 n = 4 1 4 6 4 1 n = 5 1 5 10 10 5 1

With the <pre>, the above code results in:

n = 0               1     
n = 1            1     1
n = 2         1     2     1
n = 3      1     3     3     1
n = 4    1    4     6     4     1
n = 5  1   5     10    10    5     1

Vertical align

To align text vertically, use the CSS3 property vertical-align. The old HTML property valign is not supported by HTML5. However, it is still less simple to use than horizontal alignment. The best results can be obtained by adding display:table-cell; to the elements CSS properties.

  • display:table-cell;vertical-align: baseline;
  • default, aligns to the baseline of parent element

  • display:table-cell;vertical-align: length;
  • displacement vertically by specified positive or negative amount

  • display:table-cell;vertical-align: x%;
  • displacement vertically by specified positive or negative percentage of height of parent element

  • display:table-cell;vertical-align: sub;
  • displaces text downwards as if it were a subscript (half line-height)

  • display:table-cell;vertical-align: super;
  • displaces text upwards as if it were a superscript (half line-height)

  • display:table-cell;vertical-align: top;
  • aligns to the top of the parent element

  • display:table-cell;vertical-align: middle;
  • aligns to the middle of the parent element

  • display:table-cell;vertical-align: bottom;
  • default aligns to the bottom of the parent element

  • display:table-cell;vertical-align: text-top;
  • aligns to the top of a text block

  • display:table-cell;vertical-align: text-bottom;
  • aligns to the bottom of a text block

  • display:table-cell;vertical-align: initial;
  • specifies start of alignment

  • display:table-cell;vertical-align: inherit;
  • whatever the parent element uses as alignment

Inline vertical alignment can also be achieved by using display:inline-block; vertical-align:middle;.

To align an element within a fixed size parent element (like a box), just use position:absolute; top:50%;.

Content © Renewable-Media.com. All rights reserved. Created : November 6, 2014 Last updated :October 3, 2015

Latest Item on Science Library:

The most recent article is:

Trigonometry

View this item in the topic:

Vectors and Trigonometry

and many more articles in the subject:

Subject of the Week

Physics

Physics is the science of the very small and the very large. Learn about Isaac Newton, who gave us the laws of motion and optics, and Albert Einstein, who explained the relativity of all things, as well as catch up on all the latest news about Physics, on ScienceLibrary.info.

Gravity lens

Great Scientists

Gregor Johann Mendel

1822 - 1884

Gregor Mendel is known as 'the Father of Modern Genetics' published his work, Versuche ├╝ber Pflanzenhybriden [Experiments on Plant Hybridization], on hereditary traits of peas, in 1866. The insight of his work became apparent later when the science of genetics confirmed his findings.

Gregor Mendel
IT Forum by Sean Bone

Quote of the day...

The human race is challenged more than ever before to demonstrate our mastery - not over nature but over ourselves.

ZumGuy Internet Promotions

IT information forum by Sean Bone