更改流星集合中有多少元素的CSS。

Question

因此，我正在構建一個應用程序，允許用戶存儲方程並將其放在主頁上，用戶可以在其中顯示帶有「方程式」標題的按鈕。所以我的問題是，我想顯示這些按鈕的不同取決於有多少。我想有主頁上一行並有按鍵本身的樣式，像這樣

如果只有一個按鈕：

................... ................. |按鈕| .............................. ......

如果兩個按鈕：

..................... | button | ........ ............. |按鈕| .....................

如果有三個按鈕：

............. |按鈕| ............. |按鈕| ............. |按鈕| ..........

我在網上看過，我不知道從哪裏開始添加此功能。所以我的問題是我可以從哪裏開始添加此功能？謝謝。

Answer 1

如果我理解正確，你有這樣的事情在你的HTML代碼：

<div class="row"> 
     <button>Equation</button> 
     <button>Equation</button> 
    </div> 

然後在你的CSS-代碼，您可以添加這一點，它會中心的行中的所有元素，改變按鈕的寬度，因爲你需要：

.row { 
    width: 100%; 
    display: flex; 
    flex-wrap: wrap; 
    justify-content: center; 
} 

button { 
    width: 200px; 
} 

說明：https://scotch.io/tutorials/a-visual-guide-to-css3-flexbox-properties