inlineとblockとはざっくり言うと
技術的な正確性は欠きますが見た目には……
- inline：横書きのときの横方向
- block：横書きの時の縦方向
なのでwriting-modeで縦書きにしたときは90度変化します
padding-inline/padding-blockや
margin-inline/margin-blockで簡略な記述
InternetExplorerへの対応が必要だった少し前までは使えない指定でしたが現在は使えます。top・bottomの2行で指定していたものが1行ですみますのでソースの見通しが良くなります。おすすめ！
分割した指定例
.hoge {
margin-top: 3rem;
margin-bottom: 3rem;
}
.fuga {
margin-left: auto;
margin-right: auto;
}一括の指定例
.hoge {
margin-block: 3rem;
}
.fuga {
margin-inline: auto;
}