Question

我有一个包含3个面板的jsf页面，每个面板和列都分配了css，如下所示。我给每一列b做了自动换行，但有时自动换行不起作用。我尝试给每个感应面板一个宽度= 33％，但仍然似乎没有工作。任何人都可以帮我吗？

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
            xmlns:ui="http://java.sun.com/jsf/facelets"
            xmlns:h="http://java.sun.com/jsf/html"
            xmlns:p="http://primefaces.org/ui"
            xmlns:f="http://java.sun.com/jsf/core">
<style>
    .shadowpanel.ui-panel .ui-panel-content {
        border-radius: 5px;
        background: #E6ECF0;
        box-shadow: 5px 5px 5px #888888;
    }
    .ui-chkbox-box
    {
        background: white !important;
    }
    .columnA{} 
    .columnBwithwordBreak{
        width:60%; 
        word-wrap: break-word;
    }
</style>
<p:panel styleClass="shadowpanel" style="border: none">
    <h:panelGrid columns="3" styleClass="topVerticalAlign" >
        <h:panelGrid>
            <p:panelGrid style="width: 100%;font-size: 15px;">
                <p:row>
                    <p:column style="text-align: center;font-weight: bold;">
                        <h:outputText value="Dump Header" style="color: #1484e6 "/>
                    </p:column>
                </p:row>
            </p:panelGrid>
            <h:panelGrid columns="2" style=""  columnClasses="columnA,columnBwithwordBreak">
                <h:outputText style="font-weight: bold;white-space: pre" value="Sequence ID of Dump :  "   />
                <h:outputText style="" value="#{postProcessedDump.getRegisterData().headVal.get(0)}"  styleClass="courierFont" />

                <h:outputText style="font-weight: bold;white-space: pre" value="Dump Date:  "   />
                <h:outputText style="" value="#{postProcessedDump.getRegisterData().headVal.get(1)}"  styleClass="courierFont" />

                <h:outputText style="font-weight: bold;white-space: pre" value="Dump Time:  "   />
                <h:outputText style="" value="#{postProcessedDump.getRegisterData().headVal.get(2)}"  styleClass="courierFont" />
            </h:panelGrid>
        </h:panelGrid>
        <h:panelGrid>
            <p:panelGrid style="width: 100%;font-size: 15px;">
                <p:row>
                    <p:column style="text-align: center;font-weight: bold;">
                        <h:outputText value="Cover Page" style="color: #1484e6 "/>
                    </p:column>
                </p:row>
            </p:panelGrid>
            <h:panelGrid columns="2" style=""  columnClasses="columnA,columnBwithwordBreak" >
                <h:outputText style="font-weight: bold;white-space: pre" value="Size of SVM:  "   />
                <h:outputText style="" value="#{postProcessedDump.getRegisterData().svm}"  styleClass="courierFont" />

                <h:outputText style="font-weight: bold;white-space: pre" value="Number of Active I Streams:  "   />
                <h:outputText style="" value="#{postProcessedDump.getRegisterData().aci}"   styleClass="courierFont"/>

            </h:panelGrid>
        </h:panelGrid>
        <h:panelGrid style="" styleClass="topVerticalAlign">
            <h:panelGrid>
                <p:panelGrid style="font-size: 15px; width:100%;">
                    <p:row>
                        <p:column style="text-align: center;font-weight: bold;">
                            <h:outputText value="General Registers" style="color: #1484e6 "/>
                        </p:column>
                    </p:row>
                </p:panelGrid>
                <h:panelGrid columns="8" style=""  columnClasses="columnA,columnBwithwordBreak,columnA,columnBwithwordBreak,columnA,columnA,columnBwithwordBreak,columnA" >
                    <h:outputText style="font-weight: bold;white-space: pre" value="R0:"   />
                    <p:commandLink style="color: #1484e6" action="#{coverPageProcess.newReg}" update="currentRegisterValue,regName"  value="#{postProcessedDump.getRegisterData().regValues[0]}">
                        <f:setPropertyActionListener target="#{registerData.selectedRegister}" value="R0" />
                    </p:commandLink>

                    <h:outputText style="font-weight: bold;white-space: pre" value="R1:"   />
                    <p:commandLink style="color: #1484e6" action="#{coverPageProcess.newReg}" update="currentRegisterValue,regName" value="#{postProcessedDump.getRegisterData().regValues[1]}">
                        <f:setPropertyActionListener target="#{registerData.selectedRegister}" value="R1" />
                    </p:commandLink>
                </h:panelGrid>
            </h:panelGrid>
        </h:panelGrid>
    </h:panelGrid>
</p:panel>
</ui:composition>

Answer 1

我从css中移除了white-space: pre;属性，现在效果很好。

Word Break / Word Wrap在jsf面板中不起作用

1 个答案: