Javascript 如何在React中的嵌套组件场景中使页脚与中心对齐

我现在有一个页脚应该在中间，但在我的React应用程序中它似乎在左边

CSS样式

我尝试了文本对齐：居中和对齐内容：居中，但这似乎不起作用

我使用创建了一个工作示例。请任何人回顾一下，让我知道我做错了什么

宽度：100%；应该让你有你想要的行为。位置：fixed将其置于DOM流之外，因此块元素扩展以匹配其父元素的默认行为不明显，因为它不再具有父元素

尝试左：0:右：0

.Footer{
  position: fixed;
  bottom: 0;
  text-align: center;
}