Making a div responsive - html

Question

I am trying to get a make a div which contains a set of tools responsive.I have a side menu below this which I have made responsive. Could someone let me know where would this be wrong.
#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

You have a typo in your media query: it should be # instead of ##. Aside from that, you're declaring width: 100% inline which overwrites whatever you've written in a stylesheet, which is why you don't see the result of the query.

Answer 2

Probably best to take the style="100%" from the div, any inline style like this will over-ride whatever is in the stylesheet.
Also in the media query you have
##tools { width: 70%; }
change to
#tools { width: 70%; }