页面未全屏时出现无法解释的右侧边距 - Nuxt/Tailwinds

Question

我正在尝试使用 Nuxt、Vue3 和 TailwindCSS 制作一个简单的简历页面。当我的浏览器全屏时，一切看起来都很好，而且一切都很好。但是，如果我看到全屏之外的任何内容，则应用程序主体部分的页面右侧会无缘无故地留出空白。 （请忽略可怕的设计，它仍在进行中）

如下所示，元素的右侧有一个边距，但不应该有，而且它甚至没有显示在计算的布局中。我没有添加自定义 CSS，所以我只使用默认的 Tailwind 提供的类，据我所知，不应该有右侧边距。

这是父元素，正如您所看到的，它没有会影响子元素的填充或边距。

这是我的 default.vue，其中插入了“content”元素（在 标记中）

Answer 1

顺风中的容器类不会自动应用任何水平填充或自居中。将 mx-auto 类（将 margin-left 和 margin-right 设置为 auto）添加到第一个 div 将解决该问题。