css絶対tdのテキストを整列

Question

私は外側のdivの中心に置くためにスタイルmargin: 0 auto;のテーブルを持っています。このトリックで、テーブルの幅が変更された場合、テーブルの内容はdivの中心にテーブルを残すために移動されます。これは起こりたくないものです。

<p:row> 
    <p:column> 
     <p:outputLabel for="moduleTitle" value="Module Title: " /> 
    </p:column> 
    <p:column colspan="2" style="vertical-align: central; position: absolute;"> 
     <p:outputLabel id="moduleTitle" value="#{classroomBean.classroom.module.moduleTitle}"/> 
    </p:column> 
</p:row> 

1行目は、表の2列目は、動的な値を有しているので、私はそれがテーブルの幅を変更する避けるために、この列にposition: absolute;を設定。しかし、私が絶対位置に設定した後、align関数はもう働きません。あなたは上記の印刷画面から見ることができるように
、それは誰もが絶対のコンテンツを揃える方法についてのアイデアがtdを位置付けており、代わりにデフォルトcenterのtdの上部を揃えますか？

Answer 1

テーブルに固定幅を加えてオーバーフローさせてみませんか？

とにかく、あなたがやっていることは本当に良いタイポグラフィーではありませんが、これがあなたが望むものなら、あなたのcolspan = "2"行のためのクラスを作成してください。

position: absolute; 
top: 50%; 
transform: translate(0, -50%); 

エレメントの高さの半分の幅で、エレメントを50％下に移動してから上に移動します。

のものを中心にについてもっと読み： https://www.w3.org/Style/Examples/007/center.en.html