2
我正在一個網站上工作，我試圖通過在我的html中包含<meta name="viewport" content="width=device-width">來使它移動友好。覆蓋設備寬度
不幸的是我有一個元件需要比設備寬度大。我打算使用媒體查詢在不同的屏幕尺寸上爲此元素的硬編碼值，但看起來我無法覆蓋元素寬度。
這是我要覆蓋其寬度的元素：
<div id="menu_bar">
目前我可以覆蓋此元素寬度的唯一方法是這樣做的：
<div id="menu_bar" style=" width: 1024px;">
但是如果我做：
<style>
#menu_bar {width : 1024px;}
</style>
<div id="menu_bar">
它不起作用。即使添加!important也不起作用。我需要能夠做到這一點，因爲我需要使用媒體查詢。
僅供參考，我將菜單欄作爲導軌上的紅寶石部分導入，因爲我的網站上的每個頁面都是這樣。
任何想法如何覆蓋菜單欄的寬度，以便我可以使用媒體查詢？
任何幫助，非常感謝。
您是否嘗試過@media查詢？像'@media（min-width：1024px）{}'那裏會封裝所有特定寬度的內容？ – BuddhistBeast
是的，我已經嘗試添加我的風格的媒體查詢，並沒有奏效。但問題是（對於我的測試設備至少是iPhone）寬度實際上是'320px'，但我需要覆蓋我的菜單欄的寬度爲'1024px'so設置媒體查詢寬度爲'1024px'不會工作。 – user3746602
你有沒有考慮過使用媒體查詢，並有兩個導航，其中一個隱藏，另一個顯示？就像這樣：[JsFiddle]（http://jsfiddle.net/kRn8r/1/） – BuddhistBeast