Compare text-align all possible values in HTML and CSS

Description

The following code shows how to compare text-align all possible values.

Example


<html>
<head>
<style rel="stylesheet" type="text/css">
body {<!-- w  w  w .  j av a  2 s .c  om-->
font-size: 12px;
}

table {
width: 500px;
}

td.leftAlign {
text-align: left;
}

td.rightAlign {
text-align: right;
}

td.center {
text-align: center;
}

td.justify {
text-align: justify;
}
</style>
</head>

<body>
<h1>text-align</h1>
<table>
<tr><td class="leftAlign">Here is some text</td></tr>
<tr><td class="rightAlign">Here is some text</td></tr>
<tr><td class="center">Here is some text</td></tr>
<tr><td class="justify">Here is some text</td></tr>
</table>

</body>
</html>

Click to view the demo

The code above generates the following result.

Compare text-align all possible values in HTML and CSS

Home »
  HTML CSS Tutorial »
    Text »
      CSS Text Style

Compare text-align all possible values in H...

Set text-align to center in HTML and CSS
Set text-align to justify in HTML and CSS
Set text align to justify to paragraph in H...
Set text-align to left in HTML and CSS
Set text-align to right in HTML and CSS
Compare text-decoration in HTML and CSS
Set text-decoration to line-through in HTML...
Set text-decoration to none for visited anc...
Set text-decoration to overline in HTML and...
Set text-decoration to underline in HTML an...
Set text-decoration to underline overline i...
Set text-decoration to underline overline l...
Compare text-transform in HTML and CSS
Set text-transform to capitalize in HTML an...
Set text-transform to lowercase in HTML and...
Set text-transform to uppercase in HTML and...
Compare all vertical-align settings in HTML...
Compare vertical-align possible values in H...
Compare vertical align values in HTML and C...
...