CSS/CSS Grid Layout

あるブロック内を格子状に領域分割して、その各領域に内部要素を配置する方法。

less を使う場合は、この Grid 表記に出てくるスラッシュが計算項目と認識されるので使う場合には注意が必要になる。

天地中央配置

内容物が1個の場合、Grid を使えばたった2行で天地中央配置ができる

#hoge {
    display: grid;
    place-items: center;
}

これで要素のど真ん中に内容物をもってこれる

css/css_grid_layout.txt · 最終更新: 2020-07-21 11:05 by ore

文書の先頭へ