flexでvertical-align

flexを使ってvertical-align:middleを効かすサンプル。
センタリングも。

<style>
.box {
	width: 100%;
	height:100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.item {
	display: block;
	vertical-align: middle;
}
</style>

<div class="box">
	<div class="item">
		中央
	</div>
</div>

縦方向の中央寄せ?

投稿日:
カテゴリー: 未分類

コメントする

メールアドレスが公開されることはありません。