私の JSF 2 - Primefaces 3 Web アプリケーションでは、 and を使用<p:panelGrid>して<p:panel>います。それらの中に複数のコンポーネントがあり、それらは左揃えになっています。すべてを中央揃えにする必要があります。これを行うにはどうすればよいですか div を使用しようとしましたが、機能しません。
82905 次
4 に答える
33
生成された HTML 出力を見て、それに応じて CSS を変更します。
中央に配置したい HTML 要素がブロック要素( <div>、<p>、<form>、<table>など、または によって強制されるdisplay: block;) である場合、最初に既知の幅を指定する必要があります。margin: 0 auto;要素自体のCSS 。
中央に配置したい HTML 要素がインライン要素( <span>、<label>、<a>、<img>など、またはによって強制される) である場合、その親ブロック要素でdisplay: inline;CSS を使用して中央に配置できます。text-align: center;
于 2012-10-07T00:08:05.770 に答える
16
primefaces:panelGrid のコンテンツを中央に設定したい場合は、これを試すことができます:
<h:panelGrid column="1">
<h:panelGroup style="display:block; text-align:center">
your contents...
</h:panelGroup>
</h:panelGrid>
于 2013-04-21T12:51:09.100 に答える
4
RichFacesを使用していますが、この場合に使用したソリューションはPrimefacesにも適用される可能性があります。以前は、cssを使用して内部要素のスタイルを設定していました。
ブラウザでページをレンダリングすると、ソースコードを検索して、どのHTML要素がレンダリングされているかを確認できます。次に、特定のCSSクラスを作成し、パネル全体またはpanelGridの内部要素をそのクラスに合わせてスタイル設定します。
ほとんどの場合、これは最も簡単な解決策であり、十分でした。
于 2012-10-06T11:09:06.493 に答える
2
css とp:panelGridcolumnClasses 属性を試してください:
<p:panelGrid columnClasses="centered">
...
</p:panelGrid>
次に、スタイルシートで次のようなクラスを作成します。
.centered {
text-align: center;
}
列にテキスト以外のコンポーネントがある場合はp:panelGrid、CSS クラスに margin 属性を追加します。
.centered {
text-align: center;
margin-left: 50%;
}
于 2012-10-06T15:51:48.510 に答える