在輸入元素轉到下一行時應用餘量

Question

我在Bootstrap中有內聯表單。在某個分辨率下（默認情況下，表單全部垂直時，在768px以上），其中一個輸入元素會轉到下一行。然後，在此之後（也在768px以上），另一個元素就會消失。

這是事情：我想能夠控制發生在第一個和第二個元素髮生故障的情況下。例如，我想爲首個出現故障的元素添加一個margin-top。有沒有辦法在Bootstrap中實現這一點？到目前爲止，我已經試過的唯一一件事就是一）檢測在什麼像素寬度的特定元素進入到下一行b）寫出在媒體查詢CSS，爲如：

@media (max-width: 1205px) and (min-width: 768px) { 
    .mg-up { 
    margin-top: 10px; 
    } 
} 

或者，也許另一解決方案是讓它們保持小水平，直到768px？

Answer 1

不可以，因爲CSS屬性是由媒體查詢確定的。基於媒體查詢應用保證金似乎是合理的事情，如果我面臨這個問題，我會自己做。

幾點建議：

1. 共同定位與用於表單輸入元素的內嵌/塊行爲媒體查詢margin媒體查詢規則。這是爲了提醒你（和其他人在工作）他們是相關的。如果它們默認是Bootstrap的一部分，那就忘記它。
2. 如果您使用的是Sass，請從_variables.scss（位於引導程序4）中讀取$grid-breakpoints變量，然後使用該值，以便兩種樣式行爲保持同步。