我是新的CSS网格和编码在一般的TBH。 我正在尝试为我的网站做一个商店页面，我不明白为什么我的标题和我在div中的描述之间有这么大的差距与一个类“标题容器”。

提前感谢你的帮助，

null

.container {
  display: grid;
  grid-template-rows: minmax(1000px, auto);
  grid-template-columns: 1fr 4fr;
  background-color: red;
}

.sidebar {
  background-color: blue;
}

.product-side {
  background-color: yellow;
}

.title-container {
  display: grid;
  grid-template-rows: minmax(200px, auto);
  width: 95%;
  margin: 0px auto;
  background-color: #000000;
}

.title-container h1,
p {
  color: #ffffff;
}

<div class="container">
  <div class="sidebar"></div>
  <div class="product-side">
    <div class="title-container">
      <h1>Title</h1>
      <p>Description</p>
    </div>
  </div>
</div>

null