白色的原因是你的HTML的body。添加这个全局重置可以帮助你摆脱白线。
* { margin: 0; padding: 0; }
因此，CSS数据的内容可能看起来像这样。

* {
  margin: 0;
  padding: 0;
}
.main-bottom-div {
  min-height: 35vh;
  background-color: rgb(1, 65, 99);
}
.main-middle-div {
  height: 10vh;
  background-color: rgb(1, 65, 99);
}

希望这能在某些方面对你有所帮助：）

我从来没有发现为什么会发生这种情况，但我发现的唯一解决方案是简单地把背景颜色放在父div中，并像下面这样为每个子div添加一个百分比。

.main{
  position: relative;
  height: 100px;
  background: rgba(1, 65, 99, 0.99);
}
.main-bottom-div {
  height: 65%;
}
.main-middle-div {
  height: 45%;
}

<div className={"main"}>
  <div className={"main-middle-div"}>
    <div style={{ padding: "0px 20px" }}>test </div>
  </div>
  <div className={"main-bottom-div"}>
    <div>test</div>
  </div>
</div>