Table styling
Attributes and properties of table elements, such as align, vAlign, noWrap, bgcolor, or char set various visual presentation properties of the table and its sections and cells. It is most useful when native HTML semantics or browser capabilities can replace custom implementation work.
Overview
Attributes and properties of table elements, such as align, vAlign, noWrap, bgcolor, or char set various visual presentation properties of the table and its sections and cells. It is most useful when native HTML semantics or browser capabilities can replace custom implementation work.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
api.HTMLTableCaptionElement.align Deprecated | 1 | 12 | 1 | 3 | 18 | 1 |
| HTML attribute | ||||||
align Deprecated | 1 | 12 | 1 | ≤4 | 18 | ≤3.2 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | | | | |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
width Deprecated | 1 | 12 | 1 | ≤4 | 18 | ≤3.2 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | | | | |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
width Deprecated | 1 | 12 | 1 | ≤4 | 18 | ≤3.2 |
align Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
bgcolor Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
border Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
cellpadding Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
cellspacing Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
frame Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
rules Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
summary Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
width Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
bgcolor Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | 1 | | | |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
abbr Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
axis Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
bgcolor Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | 1 | | | |
scope Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
width Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
bgcolor Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | 1 | | | |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
axis Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
bgcolor Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | 1 | | | |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
width Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
bgcolor Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | 1 | | | |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
align Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
bgcolor Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
char Deprecated | | 12 | | | | |
charoff Deprecated | | 12 | | | | |
valign Deprecated | 1 | 12 | 1 | 3 | 18 | 2 |
| DOM API | ||||||
align Deprecated The align property of the HTMLTableCellElement interface is a string indicating how to horizontally align text in the th or td table cell. | 1 | 12 | 1 | 3 | 18 | 1 |
axis Deprecated | 1 | 12 | 1 | 3 | 18 | 1 |
bgColor Deprecated The HTMLTableCellElement.bgColor property is used to set the background color of a cell or get the value of the obsolete bgColor attribute, if present. | 1 | 12 | 1 | 3 | 18 | 1 |
ch Deprecated The ch property of the HTMLTableCellElement interface does nothing. It reflects the char attribute of the cell element. | 1 | 12 | 1 | 3 | 18 | 1 |
chOff Deprecated The chOff property of the HTMLTableCellElement interface does nothing. It reflects the charoff attribute of the cell element. | 1 | 12 | 1 | 3 | 18 | 1 |
height Deprecated | 1 | 12 | 1 | 3 | 18 | 1 |
noWrap Deprecated The noWrap property of the HTMLTableCellElement interface returns a Boolean value indicating if the text of the cell may be wrapped on several lines or not. | 1 | 12 | 1 | 3 | 18 | 1 |
vAlign Deprecated The vAlign property of the HTMLTableCellElement interface is a string indicating how to vertically align text in a th or td table cell. | 1 | 12 | 1 | 3 | 18 | 1 |
width Deprecated | 1 | 12 | 1 | 3 | 18 | 1 |
align Deprecated The align property of the HTMLTableColElement interface is a string indicating how to horizontally align text in a table col column element. | 1 | 12 | 1 | 3 | 18 | 1 |
ch Deprecated The ch property of the HTMLTableColElement interface does nothing. It reflects the char attribute of the col element. | 1 | 12 | 1 | 3 | 18 | 1 |
chOff Deprecated The chOff property of the HTMLTableColElement interface does nothing. It reflects the charoff attribute of the col element. | 1 | 12 | 1 | 3 | 18 | 1 |
vAlign Deprecated The vAlign property of the HTMLTableColElement interface is a string indicating how to vertically align text in a table col column element. | 1 | 12 | 1 | 3 | 18 | 1 |
width Deprecated | 1 | 12 | 1 | 3 | 18 | 1 |
align Deprecated The HTMLTableElement.align property represents the alignment of the table. | 1 | 12 | 1 | 3 | 18 | 1 |
bgColor Deprecated The bgcolor property of the HTMLTableElement represents the background color of the table. | 1 | 12 | 1 | 3 | 18 | 1 |
border Deprecated The HTMLTableElement.border property represents the border width of the table element. | 1 | 12 | 1 | 3 | 18 | 1 |
cellPadding Deprecated The HTMLTableElement.cellPadding property represents the padding around the individual cells of the table. | 1 | 12 | 1 | 3 | 18 | 1 |
cellSpacing Deprecated While you should instead use the CSS border-spacing property, the obsolete HTMLTableElement interface's cellSpacing property represents the spacing around the individual th and td elements representing a table's cells. Any two cells are separated by the sum of the cellSpacing of each of the two cells. | 1 | 12 | 1 | 3 | 18 | 1 |
frame Deprecated The HTMLTableElement interface's frame property is a string that indicates which of the table's exterior borders should be drawn. | 1 | 12 | 1 | 3 | 18 | 1 |
rules Deprecated The HTMLTableElement.rules property indicates which cell borders to render in the table. | 1 | 12 | 1 | 3 | 18 | 1 |
summary Deprecated The HTMLTableElement.summary property represents the table description. | 1 | 12 | 1 | 3 | 18 | 1 |
width Deprecated The HTMLTableElement.width property represents the desired width of the table. | 1 | 12 | 1 | 3 | 18 | 1 |
align Deprecated The align property of the HTMLTableRowElement interface is a string indicating how to horizontally align text in the tr table row. Individual cells can override it. | 1 | 12 | 1 | 3 | 18 | 1 |
bgColor Deprecated The HTMLTableRowElement.bgColor property is used to set the background color of a row or retrieve the value of the obsolete bgColor attribute, if present. | 1 | 12 | 1 | 3 | 18 | 1 |
ch Deprecated The ch property of the HTMLTableRowElement interface does nothing. It reflects the char attribute of the tr element. | 1 | 12 | 1 | 3 | 18 | 1 |
chOff Deprecated The chOff property of the HTMLTableRowElement interface does nothing. It reflects the charoff attribute of the tr element. | 1 | 12 | 1 | 3 | 18 | 1 |
vAlign Deprecated The vAlign property of the HTMLTableRowElement interface is a string indicating how to vertically align text in a tr table row. Individual cells can override it. | 1 | 12 | 1 | 3 | 18 | 1 |
align Deprecated The align property of the HTMLTableSectionElement interface is a string indicating how to horizontally align text in a thead, tbody or tfoot table section. Individual rows and cells can override it. | 1 | 12 | 1 | 3 | 18 | 1 |
ch Deprecated The ch property of the HTMLTableSectionElement interface does nothing. It reflects the char attribute of the section element. | 1 | 12 | 1 | 3 | 18 | 1 |
chOff Deprecated The chOff property of the HTMLTableSectionElement interface does nothing. It reflects the charoff attribute of the section element. | 1 | 12 | 1 | 3 | 18 | 1 |
vAlign Deprecated The vAlign property of the HTMLTableSectionElement interface is a string indicating how to vertically align text in a thead, tbody or tfoot table section. Individual rows and cells can override it. | 1 | 12 | 1 | 3 | 18 | 1 |
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
- Since Chrome 1, the attribute can be set, but has no effect.
- This feature was removed in a later browser version (79)
- Since Edge 79, the attribute can be set, but has no effect.
- Since Safari 3, the attribute can be set, but has no effect.
- Since Chrome Android 18, the attribute can be set, but has no effect.
- Since Safari on iOS 2, the attribute can be set, but has no effect.
Syntax
<!-- 非推奨（レガシー） -->
<!-- <table border="1" cellpadding="5"> -->
<!-- 推奨（CSSを使用） -->
<table style="border-collapse: collapse;">
<tr><td style="border: 1px solid #ccc; padding: 0.5rem;">Data</td></tr>
</table>Live demo
Layout vs data table
Contrast a semantic data table with a layout grid built using CSS.
Why layout tables hurt
Explain the maintenance and accessibility costs of using tables for page structure.
Replacement options
Suggest modern layout tools that better match non-tabular design problems.
Use cases
Strengthen structure
Use Table styling to make the document outline, grouping, or semantics more explicit.
Improve meaning
Apply Table styling when clearer HTML structure helps users and tools understand the content.
Cautions
- Test Table styling in your target browsers and input environments before depending on it as a primary behavior.
- Provide a fallback path or acceptable degradation strategy when support is still limited.
Accessibility
- Prefer semantic structure that improves navigation and interpretation for assistive technologies, not just visual organization.
Related links
Powered by web-features