Horizontal & Vertical Align
In the CSS layout, you can set the horizontal and vertical alignment of the element, such as centering the text or image vertically and horizontally.
text-align: left | right | center ;
vertical-align : baseline |length| sub |super | top | text-top | middle | bottom | text-bottom |initial | inherit ;
- Horizontal & Vertical Align text
// Horizontal
p {
text-align:center;
}
//Vertical
span {
display: inline-block;
vertical-align: middle;
}
- Horizontal & Vertical Align image
// Horizontal
img {
display: block;
/*margin-left | margin-right */
margin: 0 auto;
width: 50%;
}
//Vertical
img{
vertical-align:baseline;
}