datagrid在tabs中无法显示

本来datagrid显示是一点问题都没有的，

页面部分：

 <div data-options="region:'center',border:true">
     <table id="dgBlackBoard"></table>
  </div>

JS部分:

 dgBlackBoard = $("#dgBlackBoard").datagrid({
                iconCls: 'icon-save',
                fit: true,
                fitColumns: true,
                rownumbers: true,
                nowrap: true,
                animate: false,
                border: false,
                singleSelect: true,
                toolbar:'#tb',
                idField: 'CarNo',
                url: SG.newUrl('/SG.OA/Blackboard/GetBlackboardViewModelList'),
                columns: [
                    [中间代码太多，就不贴出来了]
                                        ]

页面效果：

但是我把div放倒了tab中，其他还能显示，但是datagrid部分就显示不出来了，
页面代码：

 <div class="easyui-tabs" data-options="fit:true" id="tabs">                
                <div title="实时看板" style="height: 100%;width: 100%;">
                                       <div data-options="region:'center',border:true">
                               <table id="dgBlackBoard"></table>
                                                </div>
                                    </div>
                                    <div title="日历看板" style="height: 100%;width: 100%;">
                                    </div>
 </div>

在网上查了一下，只有一些类似的方法，但都不能解决我的问题，求教这是什么原因导致的？该如何解决？

layout布局不要和其他标签乱嵌套，会出错，要么你就整个layout放入tab里面，而不是layout中的一部分放入tab里面，不能随便乱嵌套