Revision 469793 of HTMLTableCellElement

<div>
  {{ DomRef()}}</div>
<p>The <strong><span class="external"><code>HTMLTableCellElement</code></span></strong> interface provides special properties and methods (beyond the regular {{domxref("HTMLElement")}} interface it also has available to it by inheritance) for manipulating the layout and presentation of table cells, either header or data cells, in an HTML document.</p>
<h2 id="Properties" name="Properties">Properties</h2>
<p><em>Inherits properties from its parent, {{domxref("HTMLElement")}}.</em></p>
<dl>
  <dt>
    {{domxref("HTMLTableCellElement.colSpan")}}</dt>
  <dd>
    Is an <code>unsigned</code> <code>long</code> that represents the number of columns this cell must span. It reflects the {{htmlattrxref("colspan", "td")}} attribute.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.rowSpan")}}</dt>
  <dd>
    Is an <code>unsigned</code> <code>long</code> that represents the number of rows this cell must span. It reflects the {{htmlattrxref("rowspan", "td")}} attribute.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.headers")}} {{readonlyInline}}</dt>
  <dd>
    Is a {{domxref("DOMSettableTokenList")}} describing a list of <code>id</code> of {{HTMLElement("th")}} elements that represents headers associated with the cell. It reflects the {{htmlattrxref("headers", "td")}} attribute.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.cellIndex")}} {{readonlyInline}}</dt>
  <dd>
    Is a <code>long</code> representing the cell position in the cells collection of the {{HTMLElement("tr")}} it belongs to. If the cell doesn't belong to a <code>&lt;tr&gt;</code>, it returns <code>-1</code>.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.align")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} containing an enumerated value reflecting the {{htmlattrxref("align", "td")}} attribute. It indicates the alignment of the element's contents with respect to the surrounding context. The possible values are <code>"left"</code>, <code>"right"</code>, and <code>"center"</code>.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.bgColor")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} containing the background color of the cells. It reflects the obsolete {{htmlattrxref("bgColor", "td")}} attribute.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.axis")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} containing a name grouping cells in virtual. It reflects the obsolete {{htmlattrxref("axis", "td")}} attribute.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.height")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} containing a length of pixel of the hinted height of the cell. It reflects the obsolete {{htmlattrxref("height", "td")}} attribute.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.width")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} containing a length of pixel of the hinted width of the cell. It reflects the obsolete {{htmlattrxref("width", "td")}} attribute.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.ch")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} containing one single chararcter. This character is the one to align all the cell of a column on. It reflects the {{htmlattrxref("char", "td")}} and default to the decimal points associated with the language, e.g. <code>'.'</code> for English, or <code>','</code> for French. This property was optional and was not very well supported.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.chOff")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} containing a integer indicating how many characters must be left at the right (for left-to-right scripts; or at the left for right-to-left scripts) of the character defined by <code>HTMLTableCellElement.ch</code>. This property was optional and was not very well supported.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.noWrap")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("Boolean")}} value reflecting the {{htmlattrxref("nowrap", "td")}} attribute and indicating if cell content can be broken in several lines.</dd>
  <dt>
    {{domxref("HTMLTableCellElement.vAlign")}} {{obsolete_inline}}</dt>
  <dd>
    Is a {{domxref("DOMString")}} representing an enumerated value indicating how the content of the cell must be vertically aligned. It reflects the {{htmlattrxref("valign", "td")}} attribute and can have one of the following values: <code>"top"</code>, <code>"middle"</code>, <code>"bottom"</code>, or <code>"baseline"</code>.</dd>
</dl>
<h2 id="Methods" name="Methods">Methods</h2>
<p><em>No specific method; inherits methods from its parent, {{domxref("HTMLElement")}}</em>.</p>
<h2 id="Specifications">Specifications</h2>
<table class="standard-table">
  <tbody>
    <tr>
      <th scope="col">Specification</th>
      <th scope="col">Status</th>
      <th scope="col">Comment</th>
    </tr>
    <tr>
      <td>{{SpecName('HTML WHATWG', "tabular-data.html#htmltablecellelement", "HTMLTableCellElement")}}</td>
      <td>{{Spec2('HTML WHATWG')}}</td>
      <td>No change from {{SpecName("HTML5 W3C")}}.</td>
    </tr>
    <tr>
      <td>{{SpecName('HTML5 W3C', "tabular-data.html#htmltablecellelement", "HTMLTableCellElement")}}</td>
      <td>{{Spec2('HTML5 W3C')}}</td>
      <td>The following properties have been obsoleted: <code>align</code>, <code>axis</code>, <code>bgColor</code>, <code>height</code>, <code>width</code>, <code>ch</code>, <code>chOff</code>, <code>noWrap</code>, and <code>vAlign</code>.<br />
        The <code>headers</code> property is now read-only and contains a {{domxref("DOMSettableTokenList")}} rather than a mere {{domxref("DOMString")}}.<br />
        The <code>colspan</code> and <code>rowspan</code> properties are now <code>unsigned long</code>.</td>
    </tr>
    <tr>
      <td>{{SpecName('DOM2 HTML', 'html.html#ID-82915075', 'HTMLTableCellElement')}}</td>
      <td>{{Spec2('DOM2 HTML')}}</td>
      <td>The <code>cellIndex</code> property is now read-only.</td>
    </tr>
    <tr>
      <td>{{SpecName('DOM1', 'level-one-html.html#ID-82915075', 'HTMLTableCellElement')}}</td>
      <td>{{Spec2('DOM1')}}</td>
      <td>Initial definition.</td>
    </tr>
  </tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<div>
  {{CompatibilityTable}}</div>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari (WebKit)</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatGeckoDesktop(1.0)}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
      </tr>
      <tr>
        <td><code>ch</code> and <code>chOff</code></td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Phone</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatGeckoMobile(1.0)}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatVersionUnknown}}</td>
      </tr>
      <tr>
        <td><code>ch</code> and <code>chOff</code></td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
      </tr>
    </tbody>
  </table>
</div>
<h2 id="See_also">See also</h2>
<ul>
  <li>The HTML elements implementing this interface: {{HTMLElement("th")}} and {{HTMLElement("td")}} by inheritance via {{domxref("HTMLTableHeaderCellElement")}} and {{domxref("HTMLTableDataCellElement")}}.</li>
</ul>
<p>&nbsp;</p>