html - 对齐问题

Question

我是 HTML/CSS 和 Stack-overflow 的新手。我正在为我的类(class)做一个元素，但我在正确对齐 Logo 、面包、调味品等方面遇到了问题。我在 CSS 中尝试过不同的东西，但似乎没有任何效果。任何帮助将非常感激。另外，如果我发错了，我提前道歉，这是我第一次尝试堆栈溢出，我只是想学习!

My attempt:

https://codepen.io/megmckinsey92/pen/awqVRq/?editors=1100

Answer 1

对于每个太宽的 div 尝试添加此属性:

.everythingThatIsTooWide {
  width: 25%;
  margin: auto;
 }

另外，对于每行中包含多个 div 元素的 div，例如 .extra 和 .upgrades，请执行以下操作:

<div class="wrapper">
/* My divs */
</div>

.wrapper {
  width: 25%;
  margin: auto;
}