mozilla

Revision 308041 of <center>

  • Revision slug: HTML/Element/center
  • Revision title: center
  • Revision id: 308041
  • Created:
  • Creator: ethertank
  • 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 body). This tag has been deprecated in HTML 4 (and XHTML 1) in favor of the CSS text-align property, which can be applied to the {{ HTMLElement("div") }} element or to an individual {{ HTMLElement("p") }}.

DOM Interface

This element implements the HTMLElement interface.

Implementation note: up to Gecko 1.9.2 inclusive, Firefox implements the 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 text-align:center to a div or p element centers the contents of those elements while leaving their overall dimensions unchanged.

{{ HTML:Element_Navigation() }}

See also

  • {{ Cssxref("text-align") }}
  • {{ Cssxref("display") }}

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 body). This tag has been deprecated in HTML 4 (and XHTML 1) in favor of the CSS <code>text-align</code> 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 <code><a href="/en-US/docs/DOM/element" title="DOM/element">HTMLElement</a></code> interface.</p>
<div class="note">
  <p><strong>Implementation note:</strong> up to Gecko 1.9.2 inclusive, Firefox implements the <a href="/en-US/docs/DOM/span" title="DOM/span"><code>HTMLSpanElement</code></a> interface for this element.</p>
</div>
<h2 id="Example_1" name="Example_1">Example 1</h2>
<pre class="brush:xml">
&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:xml">
&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:xml">
&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 <code>text-align:center</code> to a <code>div</code> or <code>p</code> element centers the <em>contents</em> of those elements while leaving their overall dimensions unchanged.</p>
<div>
  {{ HTML:Element_Navigation() }}</div>
<h2 id="See_also">See also</h2>
<ul>
  <li>{{ Cssxref("text-align") }}</li>
  <li>{{ Cssxref("display") }}</li>
</ul>
Revert to this revision