0

就我而言，我需要在表格中显示大约 15 列。所以我决定在一个可水平滚动的 div 中显示该表，以避免横向滚动到整个页面。

在 Firefox 中运行良好，但奇怪的是在 IE 7 中，编辑框和日期选择器没有滚动。它们是固定的。其他标签、文本区域等正在滚动。

但是没有应用 css，我在没有任何 css 的测试 xpage 中尝试了相同的方法，但结果相同。

我对默认样式表中的以下样式有疑问 - xsp.css

.xspInputFieldEditBox {
    border: 1px solid #B3B3B3;
    height: 1.25em;
    line-height: 1.5em;
    margin: 0 0.1em;
    overflow: hidden;   <---
    position: relative; <---
}

我的 div 表是这样的.. 测试样本表..

<xp:div style="color: red;overflow-x: scroll;width: 600px;">
    <xp:table>
        <xp:tr>
            <xp:td>
            <xp:label value="Label" id="label1"></xp:label>
            </xp:td>
            <xp:td>
            <xp:label value="Label" id="label2"></xp:label>
            </xp:td>
            ...
            ...
            <xp:td>
            <xp:label value="Label" id="label13"></xp:label>
            </xp:td>
            <xp:td>
            <xp:label value="Label" id="label14"></xp:label>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
            <xp:inputText id="inputText1"></xp:inputText>
            </xp:td>
            <xp:td>
            <xp:inputText id="inputText2"></xp:inputText>
            </xp:td>
            ...
            ...
            <xp:td>
            <xp:inputText id="inputText13"></xp:inputText>
            </xp:td>
            <xp:td>
            <xp:inputText id="inputText14"></xp:inputText>
            </xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
            <xp:inputText id="inputText15">
            <xp:dateTimeHelper id="dateTimeHelper5"></xp:dateTimeHelper>
            <xp:this.converter>
            <xp:convertDateTime type="date"></xp:convertDateTime>
            </xp:this.converter>
            </xp:inputText>
            </xp:td>
            ...
            ...
            <xp:td>
            <xp:inputText id="inputText28">
            <xp:dateTimeHelper id="dateTimeHelper18"></xp:dateTimeHelper>
            <xp:this.converter>
            <xp:convertDateTime type="date"></xp:convertDateTime>
            </xp:this.converter>
            </xp:inputText>
            </xp:td>
        </xp:tr>
    </xp:table>
</xp:div>

我通过继承css尝试了很多方法，但没有运气。提前致谢。

4

1 回答 1

1

一个简短的解决方案是：如果您使用必须disableTheme="true"在您的. 中设置的标准 XPage css <xp:inputText id="inputText1" disableTheme="true"></xp:inputText>，那么这些字段将在 IE7 中滚动，但它们会丢失所有 css 属性，因此您可能必须自己添加一些样式。

所以你可以使用：

    <xp:inputText id="inputText1"
        disableTheme="${javascript:!context.getUserAgent().isIE(6,7);}">
    </xp:inputText>

要禁用旧版 IE 浏览器的主题...

于 2013-05-29T09:43:09.017 回答