Vertical-align · WebPlatform Docs

Trang chủ » Html Td Align Vertical Center » Vertical-align · WebPlatform Docs

Có thể bạn quan tâm

vertical-align

Summary

The vertical-align property controls how inline elements or text are vertically aligned compared to the baseline. If this property is used on table-cells it controls the vertical alignment of content of the table cell.

Overview table

Initial value baseline Applies to inline-level and ‘table-cell’ elements Inherited No Media visual

Computed value :

Animatable No

CSS Object Model Property :

Percentages refers to the ‘line-height’ of the element itself

Syntax

  • vertical-align: <length>
  • vertical-align: <percentage>
  • vertical-align: baseline
  • vertical-align: bottom
  • vertical-align: middle
  • vertical-align: sub
  • vertical-align: super
  • vertical-align: text-bottom
  • vertical-align: text-top
  • vertical-align: top

Values

baseline Default. Vertically aligns the content with the baseline of its parent. middle Vertically aligns the content to the middle of its parent. sub Vertically aligns the content to subscript. super Vertically aligns the content to superscript. text-top Vertically aligns the content to the top of its parent. text-bottom Vertically aligns the content to the bottom of its parent. <percentage> Raises or lowers the content by a percentage of the line height. If this is set to a positive number the content is raised compared to the baseline of its parent. If this is set to a negative number the content is lowered compared to the baseline of its parent. If set to 0 it is equivalent to baseline. <length> Raises or lowers the content by the specified length. If this is set to a positive number the content is raised compared to the baseline of its parent. If this is set to a negative number the content is lowered compared to the baseline of its parent. If set to 0 it is equivalent to baseline. top Vertically aligns the content and its descendants to the top of the text line. bottom Vertically aligns the content and its descendants to the bottom of the text line.

Examples

This example uses the vertical-align property to align text within a table cell.

<table> <tr> <td style='vertical-align: top;'>Top aligned</td> <td style='vertical-align: middle;'>Middle aligned</td> <td style='vertical-align: bottom;'>Bottom aligned</td> </tr> </table>

View live example

Related specifications

CSS Level 2 (Revision 1) Recommendation

Attributions

  • Microsoft Developer Network: [Windows Internet Explorer API reference Article]

Từ khóa » Html Td Align Vertical Center