Jsf p：布局内容未与HTML元素一起显示

我正在使用JSF2.2和PrimeFaces5.2。如下图所示，如果在此布局中使用HTML元素，则不会显示布局的内容。如果我把HTML元素放在布局之外，那么一切都正常

左侧：无

元素/右侧：有

元素

我是否忽略了什么，或者这种行为是有原因的？我对JSF很陌生

---

代码

Testresult当我在JSF课程中与cagataycivici交谈时，他建议我们不要使用布局（p或pe），而是使用常规div来管理布局。嵌套布局绝对不推荐

所以我们的布局页面从

 <pe:layout fullPage="true" id="layoutFull">


        <pe:layoutPane id="idar758" position="north" closable="false" collapsible="false" size="60"
            collapsed="false" resizable="false">
            <h:form id="postLoginHeader">
                <ui:include src="./loginHeader.xhtml"/>
            </h:form>
        </pe:layoutPane>

        <p:layoutUnit position="center" closable="false" collapsible="false"
            collapsed="false" resizable="false" resizeWhileDragging="false"
            id="centerLayout">
            <div id="idar759" class="slimScrollMyPage1">
                <h:panelGrid id="panelGroup_38" columns="1" width="100%">
                    <p:messages globalOnly="true" autoUpdate="true" id="messages"
                        rendered="true" closable="true">
                        <p:effect id="idar760" type="bounce" event="load" delay="500" />
                    </p:messages>
                    <ui:insert name="body" id="insert_38" />
                </h:panelGrid>
            </div>
        </p:layoutUnit>

        <pe:layoutPane id="idar761" position="west" closable="true" resizable="false"
            resizeWhileDragging="false" size="235">
            <div id="idar762" class="slimScroll">
                <ui:include src="leftMenuAdmin.xhtml" id="include_36" />
            </div>
            <br />
            <p:spacer height="5" />
        </pe:layoutPane>

        <pe:layoutPane id="idar763" position="south" closable="false" size="30">
            <h:panelGroup id="panelGroup_40south">
                <ui:include src="./footer.xhtml" />
            </h:panelGroup>
        </pe:layoutPane>
    </pe:layout>





到


浏览器控制台和源代码告诉您什么？浏览器控制台中没有错误。但是我刚刚看到源代码包含了所有元素，但是它们没有显示出来，因为布局的高度是0px。您是否尝试过将p:layout放在表单中，看看发生了什么事情没有解决问题：/谢谢你的回答。也许使用常规的
可以解决这个问题，但我等待着看
是否有解决方案，所以我不必更改整个代码。我没有足够的声誉为您的问题添加评论。当您在panelGroupCare中添加h1时会发生什么情况？使用
布局呈现内联HTML元素
时，需要执行此操作，除非
布局设置为
块
（
），在这种情况下，它呈现块级元素
（当存在
style
和/或
styleClass
属性时）。
 <pe:layout fullPage="true" id="layoutFull">


        <pe:layoutPane id="idar758" position="north" closable="false" collapsible="false" size="60"
            collapsed="false" resizable="false">
            <h:form id="postLoginHeader">
                <ui:include src="./loginHeader.xhtml"/>
            </h:form>
        </pe:layoutPane>

        <p:layoutUnit position="center" closable="false" collapsible="false"
            collapsed="false" resizable="false" resizeWhileDragging="false"
            id="centerLayout">
            <div id="idar759" class="slimScrollMyPage1">
                <h:panelGrid id="panelGroup_38" columns="1" width="100%">
                    <p:messages globalOnly="true" autoUpdate="true" id="messages"
                        rendered="true" closable="true">
                        <p:effect id="idar760" type="bounce" event="load" delay="500" />
                    </p:messages>
                    <ui:insert name="body" id="insert_38" />
                </h:panelGrid>
            </div>
        </p:layoutUnit>

        <pe:layoutPane id="idar761" position="west" closable="true" resizable="false"
            resizeWhileDragging="false" size="235">
            <div id="idar762" class="slimScroll">
                <ui:include src="leftMenuAdmin.xhtml" id="include_36" />
            </div>
            <br />
            <p:spacer height="5" />
        </pe:layoutPane>

        <pe:layoutPane id="idar763" position="south" closable="false" size="30">
            <h:panelGroup id="panelGroup_40south">
                <ui:include src="./footer.xhtml" />
            </h:panelGroup>
        </pe:layoutPane>
    </pe:layout>

<ui:include src="./adminPostLoginHeader.xhtml" />
    <div class="container" id="div_23">
        <h:panelGrid columns="2" id="panelGrid_34"
            columnClasses="layoutColumn1,layoutColumn2">
            <h:panelGroup id="panelGroup_35">
                <div class="collapsible">
                    <p:commandButton value=" " />
                    <div id="idar762" class="slimScroll">
                        <ui:include src="leftMenuAdmin.xhtml" id="include_36" />
                    </div>
                </div>
            </h:panelGroup>
            <h:panelGroup id="panelGroup_37" width="100%">
                <div id="idar759" class="slimScrollMyPage1 bckgroundDiv"
                    style="background-image: url(#{serverThemeBean.landingImageUrl}) !important;">
                    <h:panelGrid id="panelGroup_38" columns="1" width="100%">
                        <p:messages globalOnly="true" autoUpdate="true" id="messages"
                            rendered="true" closable="true">
                            <p:effect id="idar760" type="bounce" event="load" delay="500" />
                        </p:messages>
                        <ui:insert name="body" id="insert_38" />
                        <p style="padding-bottom: 5px;" id="p_39" />
                    </h:panelGrid>
                </div>
            </h:panelGroup>
        </h:panelGrid>
    </div>
    <h:panelGroup>
        <ui:include src="./adminPostLoginFooter.xhtml" />
    </h:panelGroup>