如何將搜索框絕對保留在頂部導航欄中（並保持順暢的響應！）？

Question

我是一個新手程序員，我有幾個更有經驗的程序員試圖解決這個問題，但沒有真正的運氣。

我需要向搜索框中添加到頂部導航和搜索框可以在不同的屏幕尺寸響應 - Link to sample mockups here

搜索欄is currently wrapping/displacing here.

預先感謝任何建議！

Answer 1

這裏是一個開始：

設置搜索欄本身（股利），以顯示：內聯block`。這將使其正確定位。

div.header-phoneicon：右：350像素

然後，移動電話號碼背給它的空間。更改div.header-phoneinfo CSS right屬性，以適應它。

您需要調整width和right性能以適應一切。

Answer 2

這將需要一些媒體查詢，以漂浮在屏幕夠寬 - 「移動第一」。

.search { 
    float: none; 
} 

@media (min-width: [tablet_width]) { 
    .search, 
    .phone { 
    float: left; 
    } 
}