table - How to change the position of divs in html based on window size -

i have divs i'm using encapsulate graphs. right i'm using table align divs so:

<table>     <tr>         <td>             <div> stuff </div>         </td>         <td>             <div> stuff </div>         </td>     </tr> </table> 

however, when screen smaller, want become 2 rows divs stacked. there elegant way this?

right have side menu on page, on small screen side menu appears first , table gets pushed below it. instead, want side menu on left , divs on right. should add side menu table also?

you can style divs float left , relatively inherit first div's width margin next div

<div class="firstdiv">my stuff 1 </div> <div class="seconddiv"> stuff 2</div> 

and in style like

.firstdiv{ float:left; } .secondiv{ float:left; margin:auto }  

this responsive too. hope help

2 side menu

now enclose divs in container div , apply same above descrbed method considering ur side menu first div , stuf container seconddiv