在桌面版用標籤(Tabs) 呈現內容的方式，希望在手機看到一樣是一行水平呈現的效果，不要因為寬度限制而文字跳行，很醜，在 Oxygen Builder 可以很快透過兩個步驟實現。

在 Oxygen Builder 的設定方式

1.在 Tabs 的區塊以 CSS 設定文字不換行，若超過寬度，觸發水平滑動軸

在該 ID 區塊加上以下 CSS:

overflow: auto; /*自動判斷是否觸發 X or Y 軸滑動功能*/
white-space: nowrap; /* 在任何裝置顯示，文字不都要換行*/

2.在自訂的樣式表，設定滑動軸的樣式

預設又粗又黑，可能有些人不喜歡，可以透過以下方式設定，讓 Scroll bar 融合整體設計風格。

::-webkit-scrollbar {
  height: 1px;              /* 設定水平 scrollbar 高度 */
  width: 1px;               /* 設定水平 scrollbar 寬度 */
  border: 1px solid #fff;   /* 設定水平 scrollbar 框線樣式 */
}

::-webkit-scrollbar-thumb:horizontal{
        background: #fff; /* 設定水平 scrollbar 背景色 */
}

就這樣，大功告成！🎉 文章分享的 CSS 語法原則上適用任何網站開發，並沒有侷限於 WordPress Oxygen Builder。

關於 Horizontal Scrolling, 在 Oxygen Builder 也有更酷的應用喔。

check it out 👉 Creating A Horizontal Card-Style Post List In WordPress With Oxygen