使div響應

Question

我想獲得一個div，其中包含一組工具responsive.I有一個下面的菜單，我已作出響應。有人能讓我知道這是錯的嗎？

#tools { 
 
    width: 160px; 
 
    position: fixed; 
 
    display: inline-block; 
 
    margin: 0 auto; 
 
    line-height: 1.4em; 
 
} 
 
@media only screen and (max-width: 600px) { 
 
    #tools { 
 
    width: 70%; 
 
    } 
 
}

<div id="tools" style="width: 100%"> 
 
    <table> 
 
    <tr> 
 
     <td> 
 
     <input type="text" id="searchInput" placeholder="Type To Filter" ng-model="search" class="searchMenu"> 
 
     </td> 
 
     <td id=uploadedit> 
 
     <button id="upload" onclick="insertIntoDatabase()" class="pinColor"><i class="fa fa-upload fa-2"></i> 
 
     </button> 
 
     </td> 
 
     <td id=impledit> 
 
     <button id="implview" onclick="openImplView()" class="pinColor"><i class="fa fa-pencil fa-2"></i> 
 
     </button> 
 
     </td> 
 
     <td> 
 
     <button id="home" class="homeButton"><i class="fa fa-home fa-2"></i> 
 
     </button> 
 
     </td> 
 
     <td> 
 
     <button id="keep-menu-open" class="pinColor" ng-click="openAndFixMenu"><i class="pinColor"></i> 
 
     </button> 
 
     </td> 
 
     <td> 
 
     <button id="open-left" class="toggleButton" ng-click="toggleMenu()"> <i class="fa fa-bars fa-2"></i> 
 
     </button> 
 
     </td> 
 
    </tr> 
 
    </table> 
 
</div>

Answer 1

你在你的媒體查詢有一個錯字：它應該是#而不是##。除此之外，你聲明width: 100%內聯，它覆蓋了你在樣式表中寫的任何內容，這就是爲什麼你看不到查詢結果。

Answer 2

也許最好採取風格= 「100％」，從DIV，任何內嵌樣式類似這樣的意志戰勝騎無論是在樣式表。

另外，在媒體查詢你有

##tools { width: 70%; } 

變化

#tools { width: 70%; }