Table- How to set height for the inner div

Hi,
My table is getting all smooshed and unusable when screen resotulition is 1024 x768.
I did following :

this.setWidth(800, UNITS_PIXELS); this.setPageLength(this.getContainerDataSource().size() + 15); Initially, when table gets rendered, it looks ok. but as soon as user add an entry to the table, it gets smooshed.
I checked the generated html below:

<div class="v-table v-table-blockDidTableHeight blockDidTableHeight" id="BlockedDidsTable" style="width: 800px;"> <div class="v-table-header-wrap" style="width: 798px;"> <div class="v-table-header" style="overflow: hidden;"> <div style="width: 900000px;"> <table> <tbody> <tr> <td class="v-table-header-cell" style="width: 58px;"><div class="v-table-resizer"></div> <div class="v-table-sort-indicator"></div> <div class="v-table-caption-container" style="width: 42px;"></div></td> <td class="v-table-header-cell" style="width: 197px;"><div class="v-table-resizer"></div> <div class="v-table-sort-indicator"></div> <div class="v-table-caption-container" style="width: 181px;">Number</div></td> <td class="v-table-header-cell" style="width: 164px;"><div class="v-table-resizer"></div> <div class="v-table-sort-indicator"></div> <div class="v-table-caption-container" style="width: 148px;">Comment</div></td> <td class="v-table-header-cell" style="width: 379px;"><div class="v-table-resizer"></div> <div class="v-table-sort-indicator"></div> <div class="v-table-caption-container" style="width: 363px;">Date Added</div></td> </tr> </tbody> </table> </div> </div> <div class="v-table-column-selector" style="display: none;"></div> </div> <div tabindex="-1" class="v-scrollable v-table-body-wrapper v-table-body" style="zoom: 1; position: relative; width: 798px; height: 25px;"> <div style="height: 34px;"> <div class="v-table-row-spacer" style="height: 0px;"></div> <table class="v-table-table"> <tbody> <tr class="v-table-row" style=""> <td class="v-table-cell-content" style="width: 45px;"><div class="v-table-cell-wrapper" style="width: 45px;"> <span class="v-checkbox"><input type="checkbox" value="on" id="gwt-uid-1" tabindex="0"><label for="gwt-uid-1"></label></span> </div></td> <td class="v-table-cell-content" style="width: 184px;"><div class="v-table-cell-wrapper" style="width: 184px;">+1-231-111-224</div></td> <td class="v-table-cell-content" style="width: 151px;"><div class="v-table-cell-wrapper" style="width: 151px;">a</div></td> <td class="v-table-cell-content" style="width: 366px;"><div class="v-table-cell-wrapper" style="width: 366px;">Thu Oct 19 14:58:07 EDT 2017</div></td> </tr> </tbody> </table> <div class="v-table-row-spacer" style="height: 0px;"></div> </div> <div tabindex="0" style="position: fixed; top: 0px; left: 0px;"></div> </div> <div class="v-table-footer-wrap" style="display: none; width: 798px;"> <div class="v-table-footer" style="overflow: hidden;"> <div style="width: 900000px;"> <table> <tbody> <tr> <td style="width: 57px;"><div class="v-table-footer-container" style="width: 44px;"> </div></td> <td style="width: 196px;"><div class="v-table-footer-container" style="width: 183px;"> </div></td> <td style="width: 163px;"><div class="v-table-footer-container" style="width: 150px;"> </div></td> <td style="width: 378px;"><div class="v-table-footer-container" style="width: 365px;"> </div></td> </tr> </tbody> </table> </div> </div> </div> </div> in line 35([i]
[b]
[color=#16a085]

[/color] [/b] [/i]), height = 25px

is causing the problem.
Just wondering, is there any way to handle/control the style in this div?
Thanks in advance.