中央寄せしなければならない時に、毎回調べてるので備忘録
ブロック要素
sample.css
/* 色、幅、高さの記述は省略 */.contentA{/* 親要素 */display:flex;align-items:center;}.contentB{/* 子要素 */margin:0auto;}sample.html
<body><divclass="contentA"><divclass="contentB"></div></div></body>実行結果(赤が親要素、青が子要素)
インライン要素
インライン要素をdivで囲ってあげる
sample.css
/* 色、幅、高さの記述は省略 */.contentA{/* 親要素 */display:flex;align-items:center;}.contentB{/* 子要素 */margin:0auto;}/* ボタンの位置設定は特になし */sample.html
<body><divclass="contentA"><divclass="contentB"><inputtype="button"value="テストボタン"></div></div></body>
