跨越css网格到第二个子元素

Question

我想根据父网格安排导航的ul。

想象一下以下结构：

<div class="container">
 <div id="navigation">
  <p id="content">Content</p>
 </div>
</div>

我知道如何根据我的网格安排#navigation：

.container {
  grid-template-areas: nav nav nav nav;
  grid-template-columns: 1fr 1fr 1fr 1fr
}

#navigation {
 grid-area: nav;
}

但我能做些什么才能让#content从第二列开始？

我知道我可以使用子网格，但必须有一个没有的解决方案吗？