頁面未全螢幕時出現無法解釋的右側邊距 - Nuxt/Tailwinds

Question

我正在嘗試使用 Nuxt、Vue3 和 TailwindCSS 製作一個簡單的簡歷頁面。當我的瀏覽器全螢幕時，一切看起來都很好，而且一切都很好。但是，如果我看到全螢幕之外的任何內容，則應用程式主體部分的頁面右側會無緣無故地留出空白。 （請忽略可怕的設計，它仍在進行中）

如下所示，元素的右側有一個邊距，但不應該有，而且它甚至沒有顯示在計算的佈局中。我沒有添加自訂 CSS，所以我只使用預設的 Tailwind 提供的類，據我所知，不應該有右側邊距。

這是父元素，正如您所看到的，它沒有會影響子元素的填充或邊距。

這是我的default.vue，其中插入了「content」元素（在 標記中）

Answer 1

順風中的容器類別不會自動套用任何水平填充或自居中。將 mx-auto 類別（將 margin-left 和 margin-right 設定為 auto）新增至第一個 div 將解決該問題。