[BUG] 页面.container的内边距导致TopBar的背景颜色无法正常显示

[Zihan Zhou]

【问题描述】：
. container具有一点内边距，导致topbar的颜色修改后留下两条边。

【截图】：
dom显示

修改颜色后效果

【网站链接】：
https://have.somuch.work/

[Zihan Zhou]

再看了下，发现tapbar是包含在container内的，且受限于container的宽度。
这样似乎无法单独为tapbar修改颜色。
我的想法是让tapbar颜色修改为：

（灰色仅为表达区域）
希望能对此进行改进～

[AirboZH]

sorry，我不认为这是一个bug或者需要修改的地方，这应该属于一个比较个性化的需求。你可以fork本仓库并进行修改。

当然，目前我不会关闭这个Issue，如果有更多朋友支持这个Issue的话我会再考虑支持的。

[Zihan Zhou]

sorry，我不认为这是一个bug或者需要修改的地方，这应该属于一个比较个性化的需求。你可以fork本仓库并进行修改。

当然，目前我不会关闭这个Issue，如果有更多朋友支持这个Issue的话我会再考虑支持的。

好的

[Waite Wang]

再看了下，发现tapbar是包含在container内的，且受限于container的宽度。 这样似乎无法单独为tapbar修改颜色。 我的想法是让tapbar颜色修改为： （灰色仅为表达区域） 希望能对此进行改进～

你可以采用代码注释的方式实现你想要的效果, 如下:

<style>
  #topbar-wrapper {
    margin-left: -3rem;
    margin-right: -3rem;
    background-color: your-color;
  }
</style>

如果你只是想修改背景颜色, 不想更改 header 中的显示效果

<style>
  #topbar-wrapper {
    margin-left: -3rem;
    margin-right: -3rem;
    background-color: #888;
  }

  #topbar {
    margin-left: 3rem;
    margin-right: 3rem;
  }
</style>

最终效果如下:

[Zihan Zhou]

再看了下，发现tapbar是包含在container内的，且受限于container的宽度。 这样似乎无法单独为tapbar修改颜色。 我的想法是让tapbar颜色修改为： （灰色仅为表达区域） 希望能对此进行改进～

你可以采用代码注释的方式实现你想要的效果, 如下:

<style>
  #topbar-wrapper {
    margin-left: -3rem;
    margin-right: -3rem;
    background-color: your-color;
  }
</style>

如果你只是想修改背景颜色, 不想更改 header 中的显示效果

<style>
  #topbar-wrapper {
    margin-left: -3rem;
    margin-right: -3rem;
    background-color: #888;
  }

  #topbar {
    margin-left: 3rem;
    margin-right: 3rem;
  }
</style>

最终效果如下:

牛的，没想到能这样写。太久没写前端了😂