Vertically Align Text

 

Vertically Align Text

You can vertically align text within a web page.

Superscript

superscript
 
Place the following code before the text you would like to align:
 

<span style="vertical-align: 30%;">3×102

Edit the text in bold to suit your needs.

Place the following code after the text you would like to align:

</span>

Subscript

subscript
 
Place the following code before the text you would like to align:
 

<span style="vertical-align: 30%;">C6H12O6

Edit the text in bold to suit your needs.

Place the following code after the text you would like to align:

</span>

The percentage specifies a percentage of the distance to the line height above or below the normal line height. It raises or lowers the baseline by a percentage of the line-height to the next line. For example, a value of 50% will raise the baseline to halfway between the normal baseline and the baseline of the line above. A value of -100% will lower the baseline to the same height as the baseline of the line below. 30% or -30% looks about right for things like scientific notation.

This concludes the vertically align text section.

 
 

 
 
Visit the following pages for a wealth of copy and paste codes and tips:

HTML Tips
Copy and paste special effect HTML codes for your web page.

HTML Codes
An HTML codes chart you can use to copy and paste codes into your web page.

HTML Color Codes
An HTML color codes chart you can use to copy and paste color codes into your web page.

JavaScript Codes
Copy and paste special effect JavaScript codes for your web page.

Web Design Tips
Tips, tricks, and special effect codes for your web page.

HTML Tags
A list of HTML tags.

HTML 5 Tags
A list of the latest HTML tags to be developed.

ASCII Codes
Special text characters and code for your web page.

Code provided by:
John Nitkowski