Jquery 数据表宽度问题+；struts2中的数据表搜索操作

祝大家好。我使用struts2+hibernate构建了web应用程序。我试图在表示我的表时实现JQuery选项卡和datatable。下面是我的页面布局。以下是问题清单

问题1：我已将数据表放在其中一个选项卡（div）“查看收入”中。但是数据表正在从div区域填充出来。我希望在选项卡区域中显示datatable（在吹扫图像中用红色标记）

问题2：我试图通过减小表的大小来解决上述问题，但没有成功。有人能告诉我怎样才能减小桌子的尺寸吗。我试过这样做，但没有成功

<table class="display IncomeTable" cellspacing="0" width="600px">

struts.xml：

<action name="refreshIncomeData" class="com.hibernate.action.DataTableIncomeAction" method="incomeExecute">
        <result type="json"></result>
</action>

---

我能够解决1和2个问题。这是我的更新代码。我刚刚把它放在一个新的有特定宽度的div中

更新的HTML代码：

 <div id="incomesViewTab">
    <div style="width:600px">
        <table class="IncomeTable" cellspacing="0" width="100%">
            <thead>
            <tr>
                <th>Description</th>
                <th>Category</th>
                <th>Payee</th>
                <th>Date</th>
                <th>Amount</th>
            </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
  </div>

其中一个选项卡中的数据表视图：


如果有人需要更多信息，请告诉我

注意：问题3仍未解决。非常感谢您的任何意见或建议。
我能够解决1和2个问题。这是我的更新代码。我刚刚把它放在一个新的有特定宽度的div中

更新的HTML代码：

 <div id="incomesViewTab">
    <div style="width:600px">
        <table class="IncomeTable" cellspacing="0" width="100%">
            <thead>
            <tr>
                <th>Description</th>
                <th>Category</th>
                <th>Payee</th>
                <th>Date</th>
                <th>Amount</th>
            </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
  </div>

其中一个选项卡中的数据表视图：


如果有人需要更多信息，请告诉我

注意：问题3仍未解决。非常感谢您的任何意见或建议。

 <div id="incomesViewTab">
    <div style="width:600px">
        <table class="IncomeTable" cellspacing="0" width="100%">
            <thead>
            <tr>
                <th>Description</th>
                <th>Category</th>
                <th>Payee</th>
                <th>Date</th>
                <th>Amount</th>
            </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
  </div>

$(".IncomeTable").dataTable({
    "paging":true,
    "searching": true,
    "bProcessing" : false,
    "bServerSide" : true,
    "bJQueryUI" : true,
    "info":true,
    "bAutoWidth": false,
    "aLengthMenu": [[10, 25], [10, 25]],
    "sPaginationType" : "full_numbers",
    "sAjaxSource" : "refreshIncomeData",
    "aoColumns": [
         {"mData":"description","bSearchable": true,"bSortable": true},
         {"mData":"catergory.userCodeName","bSearchable": false,"bSortable": false},
         {"mData":"payee.payeeName","bSearchable": false,"bSortable": false},
         {"mData":"transactionDate","bSearchable": false,"bSortable": false},
         {"mData":"amount","sWidth":"30px","bSearchable": false,"bSortable": false}]

});