关于tab页嵌套datagrid高度、宽度适应 滚动条问题

liuziliangjava

如标题所示：
就是我在tab页面中嵌套了相应的页面(B.jsp) B.jsp页面中有datagrid列表进行展示，但是现在有个问题就是说 ，当我的datagrid列数比较多的时候，datagrid只有一条记录的时候，会出现横向滚动条会把那一条展示的记录给覆盖掉了，如果是多条记录的话是不会出现这个问题

因为网络问题，这个图片截图上传不上去
相应的jsp：
    <div id="grid1" class="mini-datagrid mini-fit" style="width:100%;height:auto;"sortMode="client"
        url="" dataField=""
            allowAlternating="true" multiSelect="false" showEmptyText="true" showPager="true"
            emptyText="没有查到数据" showReloadButton="false" showColumnsMenu="true"
            onrowdblclick="" allowCellEdit="true" allowCellSelect="true"onselectionchanged="onSelectionChanged"
            sizeList="[10,20,50,100]" pageSize="10">
        <div property="columns">
                <div type="checkcolumn">选择</div>
                <div field="partyNum" headerAlign="center" allowSort="true">A</div>
                <div field="partyName" headerAlign="center" allowSort="true">B</div>
                <div field="custRiskTypeCd" headerAlign="center" allowSort="true" dictTypeId="XD_FLCD0002">C</div>
                <div field="shbackEnterpriseSizeCd" headerAlign="center" allowSort="true" dictTypeId="CDKH0025">D</div>
                <div field="creditRatingCd" headerAlign="center" allowSort="true" dictTypeId="XD_KHCD0228">E</div>
                <div field="creditExposure" headerAlign="center" allowSort="true">F</div>
                <div field="availableExposure" headerAlign="center" allowSort="true" >G</div>               
        </div>
        </div>
</div>

就是如果这个<div field="creditExposure" headerAlign="center" allowSort="true">F</div>这个比较多的时候，会出现这个问题
因为这个列数都是不固定的



css：
.mini-panel-body, .mini-grid-rows-view {
        overflow: auto;
}
.mini-grid-rows-view {
        height:auto;
}


麻烦版主帮我看一下，非常感谢！

liuziliangjava

我把截图发到csdn了 ，麻烦版主看一下 非常感谢
http://blog.csdn.net/lzljava/article/details/40043725

dforce

liuziliangjava 发表于 2014-10-13 13:50
我把截图发到csdn了 ，麻烦版主看一下 非常感谢
http://blog.csdn.net/lzljava/article/details/40043725 ...

你的浏览器是什么

liuziliangjava

dforce 发表于 2014-10-13 14:17
你的浏览器是什么

IE浏览器  几个版本都试过了 都有这个问题

liuziliangjava

liuziliangjava 发表于 2014-10-13 14:18
IE浏览器  几个版本都试过了 都有这个问题

现在是因为
<div id="grid1" class="mini-datagrid mini-fit" style="width:100%;height:auto;"sortMode="client">
这个datagrid的高度我们是设置为height:auto的,然后当这个datagrid列数比较多的时候，这个横向滚动条就会出来，因为横向滚动条自己也占有个高度，而且当datagrid列表只有一条记录的时候，这个滚动条就会把那一条记录给遮住，现在就是说有没有一个办法可以在哪个公共的地方把height:auto设置为一个固定高度，因为我现在很多页面都会有这个问题，不可能每个页面去手动改这个

麻烦版主提供一下思路，谢谢

dforce

liuziliangjava 发表于 2014-10-13 14:30
现在是因为

这个datagrid的高度我们是设置为height:auto的,然后当这个datagrid列数比较多的时候，这个横 ...

<div class="mini-fit">
    <div class="mini-datagrid"

liuziliangjava

dforce 发表于 2014-10-13 14:43

版主，因为系统有这个问题的页面非常多，一一改也现实，现在这个问题也比较急，客户明天就要演示，有没有一个公共的方法或者设置什么样式 能在所有的datagrid生效吗？先谢谢版主

dforce

liuziliangjava 发表于 2014-10-13 14:51
版主，因为系统有这个问题的页面非常多，一一改也现实，现在这个问题也比较急，客户明天就要演示，有没有 ...

mini-fit 和mini-datagrid是两个控件，你为什么要写在一起
分开写之后还有没这个问题？

liuziliangjava

dforce 发表于 2014-10-13 15:02
mini-fit 和mini-datagrid是两个控件，你为什么要写在一起
分开写之后还有没这个问题？ ...

版主，我这边现在想到的办法就是说
复写了
.mini-grid-rows-view {
        height:100px;
}
这个CSS ，但是这个height:100%写成百分比是不行的，因为每个电脑的分辨率是不一样的
因为之前开发的时候mini-fit这个控件我们是没用的，现在页面非常多 也不可能现在去加这些东西了
版主，你这边有什么办法 解决我上述问题思路吗？谢谢

有没有办法在加载页面之前把mini-fit加到datagrid里面去呢？或者有什么其他办法

factory

liuziliangjava 发表于 2014-10-13 15:09
版主，我这边现在想到的办法就是说
复写了
.mini-grid-rows-view {

我们处理下