【CSS】グリッドレイアウトでbodyにdisplay:gridを指定するのはありなのか

2018年7月4日2019年6月12日CSS,グリッドレイアウト

グリッドレイアウトで良くあるcontainerではなくbodyにdisplay:gridを定義するのはありなのだろうか

HTML

<body>
<header></header>
<nav></nav>
<main></main>
<div id="side"></div>
<footer></footer>
</body>

CSS

body {
  font-family: "メイリオ", sans-serif;
  display: grid;
  grid-template-columns: 1fr 350px;
  grid-template-rows: 40px 40px 1fr 30px;
  grid-gap: 0px;
  grid-template-areas:
    "head head"
    "menu menu"
    "main side"
    "foot foot";
}

header{grid-area: head;}
#menu{grid-area: menu;}
main{grid-area: main;}
#side{grid-area: side;}
footer{grid-area: foot;}

ちょっと気になったので少し見てみると

やはりグリッドレイアウトの紹介記事ではcontainer（div）に指定しているものも多いですが、海外サイトでは結構bodyにdisplay: gridを指定しているものもありますね

支障はないのか、というとどうだろうか

body内にはスクリプトなど視覚的なもの以外のコードも入れる可能性もありますが、まあコンテンツ内にjavascript埋める事はありますしね

検索エンジンの評価が悪くなるなら避けるべきですがhttps://developers.google.com/の記事でもbodyにdisplay: grid;指定してますし問題なさそう