Revision 401253 of <center>

  • Revision slug: Web/HTML/Element/center
  • Revision title: <center>
  • Revision id: 401253
  • Created:
  • Creator: tregagnon
  • Is current revision? No
  • Comment

Revision Content

{{deprecated_header()}}

Summary

The HTML Center Element (<center>) is a block-level element that can contain paragraphs and other block-level and inline elements. The entire content of this element is centered horizontally within its containing element (typically, the {{HTMLElement("body")}}). This tag has been deprecated in HTML 4 (and XHTML 1) in favor of the CSS {{Cssxref("text-align")}} property, which can be applied to the {{HTMLElement("div")}} element or to an individual {{HTMLElement("p")}}.

DOM Interface

This element implements the {{domxref("HTMLElement")}} interface.

Implementation note: up to Gecko 1.9.2 inclusive, Firefox implements the {{domxref("HTMLSpanElement")}} interface for this element.

Example 1

<center>This text will be centered.
<p>So will this paragraph.</p></center>

Example 2 (CSS alternative)

<div style="text-align:center">This text will be centered.
<p>So will this paragraph.</p></div>

Example 3 (CSS alternative)

<p style="text-align:center">This line will be centered.<br>
And so will this line.</p>

Note

Applying {{Cssxref("text-align")}}:center to a {{HTMLElement("div")}} or {{HTMLElement("p")}} element centers the contents of those elements while leaving their overall dimensions unchanged.

See also

  • {{Cssxref("text-align")}}
  • {{Cssxref("display")}}
{{HTML:Element_Navigation}}

Revision Source

<div>
  {{deprecated_header()}}</div>
<h2 id="Summary">Summary</h2>
<p>The HTML Center Element (<code>&lt;center&gt;</code>) is a <a href="/en-US/docs/HTML/Block-level_elements" title="HTML/Block-level_elements">block-level element</a> that can contain paragraphs and other block-level and inline elements. The entire content of this element is centered horizontally within its containing element (typically, the {{HTMLElement("body")}}). This tag has been deprecated in HTML 4 (and XHTML 1) in favor of the <a href="/en-US/docs/Web/CSS" title="/en-US/docs/Web/CSS">CSS</a> {{Cssxref("text-align")}} property, which can be applied to the {{HTMLElement("div")}} element or to an individual {{HTMLElement("p")}}.</p>
<h2 id="DOM_Interface">DOM Interface</h2>
<p>This element implements the {{domxref("HTMLElement")}} interface.</p>
<div class="note">
  <p><strong>Implementation note:</strong> up to Gecko 1.9.2 inclusive, Firefox implements the {{domxref("HTMLSpanElement")}} interface for this element.</p>
</div>
<h2 id="Example_1" name="Example_1">Example 1</h2>
<pre class="brush: html">
&lt;center&gt;This text will be centered.
&lt;p&gt;So will this paragraph.&lt;/p&gt;&lt;/center&gt;
</pre>
<h2 id="Example_2" name="Example_2">Example 2 (CSS alternative)</h2>
<pre class="brush: html">
&lt;div style="text-align:center"&gt;This text will be centered.
&lt;p&gt;So will this paragraph.&lt;/p&gt;&lt;/div&gt;
</pre>
<h2 id="Example_3" name="Example_3">Example 3 (CSS alternative)</h2>
<pre class="brush: html">
&lt;p style="text-align:center"&gt;This line will be centered.&lt;br&gt;
And so will this line.&lt;/p&gt;
</pre>
<h2 id="Notes" name="Notes">Note</h2>
<p>Applying {{Cssxref("text-align")}}<code>:center</code> to a<code> </code>{{HTMLElement("div")}} or {{HTMLElement("p")}} element centers the <em>contents</em> of those elements while leaving their overall dimensions unchanged.</p>
<h2 id="See_also">See also</h2>
<ul>
  <li>{{Cssxref("text-align")}}</li>
  <li>{{Cssxref("display")}}</li>
</ul>
<div>
  {{HTML:Element_Navigation}}</div>
Revert to this revision