CSS Vertical Align

Next ❯CSS Counter

Used to set the vertical alignment of an inline element

  • turned_in_notVertical Align Property
    • vertical-align
  • Only the cell content position will be affected within the cell, not the cell itself (when applied to the table cells)

Chekout me span Normal Text

vertical-align:
span {
  vertical-align:baseline;
  background-color:yellow;
}
Vertical Alignsubject
Table
Some textMy position is changing

vertical-align:
#ver2a {
  vertical-align:middle;

}
Vertical Alignsubject


Property Values
ValueUsed to
baseline(default) Align the baseline of the element with the baseline of the parent element
subAlign the element as subscript
superAlign the element as superscript
topAlign the top of the element with the top of the tallest element on the line
bottomAlign the bottom of the element with the lowest element on the line
middleAlign the element in the middle of the parent element
text-topAlign the top of the element with the top of the parent element
text-bottomAlign the bottom of the element with the bottom of the parent element
lengthAlign the element vertically by the specified length (like in: px, em) from baseline
%Align the element vertically respect to the % of "line-height" property value

  • CSS Counter
❮ Prev CSS Float
Next ❯CSS Counter
TryOut Examples"Learn to Explore..!"

TryOut Editor

receipt