heightをとった要素に文字を入れると文字の縦位置は上揃えになる。
横位置は、text-align: center;で真ん中揃えにしている。
heightと同じ高さでline-heightを入れる
line-heightをheightと同じ高さにすると、縦位置を要素の真ん中に配置できる。
※2行以上の場合はこの小技は使えない。
.box1 {
width: 300px;
height: 300px;
background: #f00;
text-align: center;
color: #fff;
/* line-heightをheightと同じ高さに */
line-height: 300px;
}実装後
インスタでHTML,CSSの小技を配信中
