Resizing the whole GridView


I hope this control automatically reszes itself accordingly to its parent container. It did not work properly. I tried the following two ways in IE9, Safari5.1 and Chrome17:
1) Set control Width="100%" Height="100%"
Width worked fine; but height did not change at all when resizing the browser window.
2) Used javascript dynamically change them on window.onresize event, e.g.
var grid = document.getElementById('<%=CoolGridView1.ClientID%>');
grid.style.width = '300px';
grid.style.height = '200px';
Again, width was ok, but height behaved weird. For Chrome and Safari, the frame (border) did not resize, but the height of each row changed; but for IE, no change at all.