为什么页脚不采用100%的宽度?

我有一个简单的React应用程序,我的页脚没有100%的宽度(我在左右两侧看到了小的空白)。有人能告诉我我错过了什么吗?

这里 LIVE DEMO

这是我的css:

.App {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.footer {
  margin-top: auto;
  background-color: #000;
  color: #fff;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  padding: 25px 0;
}

附录tsx

  return (
     <div className="App">
       <Footer />
     </div>
    );

我的问题图片: