如何將<h:panelGrid>中的項目與右側對齊

如何將我下面的所有內容與最右側對齊？如何將<h:panelGrid>中的項目與右側對齊

<div id="container">  
    <h:form id="authenticate"> 
     <h:panelGrid columns="5" cellpadding="6"> 
      <h:inputText id="email" value="" /> 
      <p:watermark for="email" value="Email"/> 
      <h:inputSecret id="password" value="" /> 
      <p:watermark for="password" value="Password"/> 
      <p:commandButton id="login" value="Login" align="right"/> 
     </h:panelGrid> 
    </h:form> 
</div>

來源

2010-09-15 curiousgeorge

<h:panelGrid>呈現HTML表格。你基本上想要在它呈現的每個<td>元素上應用text-align: right;。在當前的代碼，最簡單的將是應用以下：

#authenticate table td { 
    text-align: right; 
}

你當然也可以更具體，例如給<h:panelGrid>自己的styleClass並在CSS中定義規則（這將直接應用於呈現的HTML <table>元素）。

<h:panelGrid styleClass="className">

與

.className td { 
    text-align: right; 
}

您還可以通過columnClasses屬性，它接受CSS類名這是要在<td>元素重複應用的一個逗號分隔字符串給每個<td>元素自己的類。如果你想申請的每<td>元素在同一類，只指定了一次。

<h:panelGrid columnClasses="className">

與

.className { 
    text-align: right; 
}

作爲一個額外的暗示：在網頁瀏覽器中右擊網頁，選擇查看來源，那麼你會更好地理解JSF正在產生的東西。

來源

2010-09-15 01:58:37 BalusC

注意：對於columnClasses，它們適用於_rendered_列，而不是列出的所有列。對於Mojarra 2.0，這是在生成的td-element上設置任何屬性的唯一方法。 – 2011-03-07 12:44:42

您經常會將「舊」帖子提升爲更通用，更易於查找等等。這個帖子是否可以使用？請參閱http://stackoverflow.com/questions/30136972/how-to-specify-styles-for-hpanelgrid -in的JSF – Kukeltje 2015-05-09 08:49:41

實際上我用相同的形式<p:panel>得到了很好的結果。好像 ;

<p:panel styleClass="ui-panel-titlebar ui-widget-header ui-helper-clearfix ui-corner-all"> 
    <p:commandButton value="Add New Tab" 
      actionListener="#{xxx.createNewTab}" process="@this" 
      update="tabView" style="float:right !important;margin:0px 0px 3px 0px;" /> 
      </p:panel>

來源

2012-09-24 13:41:30 newuserua

晚了一點，但可能會幫助別人，因爲這是我所需要的...

如果定位不侷限於此特定的表，而是對所有的表格單元格的默認格式，然後只需添加到您的CSS文件：

td { 
    text-align: right; 
}

然後，所有<td>元素，包括JSF生成的，將這樣的格式。

來源

2013-07-26 12:05:59 neizan

如何將<h:panelGrid>中的項目與右側對齊

回答

相關問題