jsf - 如何右对齐 h：panelGrid？

Question

我在 jsf 中为网页设计了一个导航栏。

我希望一些链接在栏的右侧，一些在左侧。它似乎不起作用。

有任何想法吗？

<h:panelGrid columnus="2">
<h:panelGroup styleClass="alignmentLeft">
    <h:panelGrid columns = "2" columnsClasses = "alignmentLeft">
        <h:outputLink>... </h:outputLink>
            <h:outputText/>
        <h:outputLink>... </h:outputLink>
        <h:outputText/>
    </h:panelGrid>
</h:panelGroup>
<h:panelGroup styleClass="alignmentRight">
    <h:panelGrid columns = "2" columnsClasses = "alignmentRight">
        <h:outputLink>... </h:outputLink>
            <h:outputText/>
        <h:outputLink>... </h:outputLink>
            <h:outputText/>
    </h:panelGrid>
</h:panelGroup>
</h:panelGrid>


.alignmentRight {
 text-align : right;
}

Answer 1

试试这个，你的编码中也有一个输入错误，它是你输入的第一个 h:panelGrid 的列“columnus”

<h:head>必须在样式表里面声明。

<h:head>
<h:outputStylesheet name="styles.css"
        library="css" />
</h:head>

然后在<h:body>

<h:body> 
<h:panelGrid columns="2" width="600">
        <h:panelGroup>
            <h:panelGrid columns="2" columnClasses="alignmentLeft" width="200">
                <h:outputLink>...1 </h:outputLink>
                <h:outputLink>...2 </h:outputLink>
            </h:panelGrid>
        </h:panelGroup>
        <h:panelGroup>
            <h:panelGrid columns="2" columnClasses="alignmentRight" width="200">
                <h:outputLink>...3 </h:outputLink>
                <h:outputLink>...4 </h:outputLink>
            </h:panelGrid>
        </h:panelGroup>
    </h:panelGrid>
</h:body>

在样式表（styles.css）中，样式是，

.alignmentLeft {
 text-align : left;
 border: 1px solid black;
 background-color: orange;
}
.alignmentRight {
 text-align : right;
 border: 1px solid black;
 background-color: lime;
}