以前在 JSF
表单中使用的是 <table>
标签。但我注意到使用 panelGrid
标签会更好,因为它更易于使用和更简单。
以前,我为 <h:message>
标签使用了额外的 <td>
并将其宽度设置为 300
,以防止表单在出现消息时向左移动。
现在,我正在使用 <h:panelGrid>
标签的 width
属性,但这并不是我想要的效果。
当出现任何错误消息时,整个表单都会向左移动,然后消息会出现在每个 input text
前面。
我尝试使用 message
标签的 width
属性,但效果不佳。
我应该回到使用 <table>
而不是 <h:panedGrid>
吗?
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<title>Facelet gg</title>
</h:head>
<h:body>
<center>
<h:form>
<h:panelGrid columns="3" width="400">
<h:outputLabel value="Username:"/>
<h:inputText id="username" value="#{loginBean.username}" required="true">
<f:validateLength maximum="30" minimum="3"/>
</h:inputText>
<h:message for="username" />
<h:commandButton value="submit" action="home"/>
</h:panelGrid>
</h:form>
</center>
</h:body>
</html>
<center>
标签早已被弃用,请坚持使用 CSS 代替margin: 0 auto;
,margin-left: auto;
,margin-right: auto;
。 - Tiny.makeCenter
的设置,并通过class属性将其添加到form
标记中,如下所示:<h:form id="loginForm" class="makeCenter">
,但是没有起作用! - user4279433.makeCenter{ margin: 0 auto; margin-left: auto; margin-right: auto; }
- user4279433auto
会被替换为适当的值,例如可以用于块的居中。div { width:50%; margin:0 auto; }
可以将div容器水平居中。" 参见。 - Tiny