primefaces <p:layout>不使用IE 9 </p:layout>

时间:2013-01-26 11:31:40

标签: internet-explorer jsf-2 primefaces

使用IE浏览http://gamma.j.layershift.co.uk

时遇到问题

我的网站是使用带有primefaces 3.5的JSF2构建的。

**其他页面可以在Firefox和Chrome上看到。

问题仅发生在索引(第一页)上。

<ui:composition template="/templates/template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<ui:define name="content">
    <!-- p:galleria panelWidth="960" panelHeight="350"
        value="#{mbIndex.img}" var="image" styleClass="ui-corner-all">
        <p:graphicImage id="gal_image" value="resources/images/#{image}" />
    </p:galleria -->

    <p:imageSwitch effect="fade" speed="2900" styleClass="center"
        style="width:1000px;height:400px;">
        <ui:repeat value="#{mbIndex.img}" var="image">
            <p:graphicImage value="resources/images/#{image}"
                style="clip:rect(0px, 1000px, 400px, 0px);min-width:1000px; min-height:400px;" />
        </ui:repeat>
    </p:imageSwitch>

    <br />

    <p:layout style="max-height:500px !important;">
        <p:layoutUnit position="west" header="About GAMMA"
            style="max-width:300px !important; height:300px; !important">
            <h:outputLabel style="word-wrap: break-word;"
                value="The company started in 2012 focusing on the production of disinfectants. Our products are used in laboratories, clean rooms, and process areas in pharmaceutical, biotechnology, healthcare, academic and industrial facilities in addition to livestock animals, " />
            <p:commandLink value="More info..." action="#{mbIndex.toAbout}"></p:commandLink>

    </p:layoutUnit>

        <p:layoutUnit position="center" header="Latest news">

        </p:layoutUnit>
    </p:layout>
</ui:define>
</ui:composition>

请解释一下?
感谢。

来自Firefox的截图(页面应该是什么)。 This screenshot from Firefox

- 使用IE时只显示图像。

2 个答案:

答案 0 :(得分:7)

以下在IE 9中为我工作,我在我的CSS中有这个。

.ui-layout-container {
    overflow-x:visible !important; overflow-y:visible !important;
}

答案 1 :(得分:1)

这是一个CSS问题。

修改css类ui-layout-container或设置样式属性并将overflow属性更改为:

<p:layout style="max-height:500px !important; overflow-x:visible !important; overflow-y:visible !important;">

这在IE8中对我有用,也可以在IE9中使用。