在CSS中，橫向排列是一個非常常見的設計需求。它可以讓頁面看起來更加美觀和整潔，也能讓頁面的布局更加自由靈活。本文將介紹幾種常見的CSS橫向排列技術。

.horizontal-container {
display: flex;
justify-content: space-between;
}
.horizontal-container >div {
width: 30%;
}
.horizontal-container {
display: inline-block;
white-space: nowrap;
font-size: 0;
}
.horizontal-container >div {
display: inline-block;
width: 30%;
font-size: 16px;
}
.horizontal-container {
display: table;
width: 100%;
table-layout: fixed;
}
.horizontal-container >div {
display: table-cell;
width: 30%;
}

以上是三種用CSS實現橫向排列的方法。

第一種方法是使用flex布局。設置父容器display屬性為flex，然后使用justify-content屬性來控制子元素的水平對齊方式。在這個例子中，我們使用了space-between值，它可以讓每個子元素都間隔相等，并且位于容器的兩端。

第二種方法是使用inline-block。這種方法設置了父容器的display屬性為inline-block，在元素之間移除了空白字符，并嘗試使它們在一行內排列。為了保證每個元素的寬度相等，我們還需要設置font-size為0，然后在子元素上恢復它。在這個例子中，我們使用了30%的寬度來使每個子元素在同一行中保持相同的寬度。

第三種方法是使用table布局。設置父容器的display屬性為table，子元素的display屬性為table-cell，那么子元素就會被強制以表格單元格的方式排列。這種方法還有一個額外的好處，就是它可以將每個子元素的寬度設置為相同的百分比，并且使用table-layout屬性可以控制它們如何被分配寬度。

以上是CSS橫向排列的三個常見技術，它們各有優缺點，選擇不同的方法會取決于具體的需求。需要注意的是，盡管這些方法看起來簡單，但要理解它們的工作原理和局限性是非常重要的，否則可能會導致一些意外的問題。