Set text-align to center in HTML and CSS

Description

The following code shows how to set text-align to center.

Example


<!-- ww w.j  a  v a2 s.co m-->






<html>
<head>
<title>text-align</title>
<style type='text/css'>
body {
font: 12px sans-serif;
}
h1 {
font: 14px sans-serif;
margin: 0;
color: darkslateblue;
border-bottom: 1px solid steelblue;
}
p {
color: darkslateblue;
padding: 10px;
}
p#left {
text-align: left;
}
p#center {
text-align: center;
}
p#right {
text-align: right;
}
p#justify {
text-align: justify;
}
</style>


</head>
<body>
<h1>Mitch Hedberg Quotes</h1>
<p id='left'>
"Fettuccine alfredo is macaroni and cheese for adults."
</p>
<p id='right'>
"Rice is great if you're really hungry and want to eat two
thousand of something."
</p>
<p id='center'>
"I'm lactose intolerant, so I eat my cereal with a fork."
</p>
<p id='justify'>
"this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test.
this is a test. this is a test. this is a test. this is a test. "
</p>
</body>
</html>

Click to view the demo

The code above generates the following result.

Set text-align to center in HTML and CSS

Home »
  HTML CSS Tutorial »
    Text »
      CSS Text Style

...
Set text-indent to 25% in HTML and CSS
Set text-indent to -5% in HTML and CSS
Use margin to indent paragraph in HTML and ...
Set letter-spacing to 10px; in HTML and CSS
Set letter-spacing to 2px in HTML and CSS
Set letter-spacing to negative value in HTM...
Set letter-spacing to normal in HTML and CS...
Compare line-height:normal, 18px, 1.5em, 1....
Compare line height settings in HTML and CS...
Set font-size and line-height in HTML and C...
Set line height for a paragraph in HTML and...
Set line height to 1em in HTML and CSS
Set line-height to 1.4em in HTML and CSS
Set line height to 3em in HTML and CSS
Set line-height to 75% in HTML and CSS
Set line height with various measurements i...
Set paragraph line-height to 150% in HTML a...
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...
Set vertical align for table cells in HTML ...
...