如何在h:panelGrid中设置一行的高度

时间:2013-10-24 05:57:57

标签: css jsf-2

我想在h:panelGrid中设置一行的高度。

我怎样才能实现这个目标?

这是我的css课程:

.height8 {
    height: 8px;
}

.height0 tr td{
    height: 0%
}

页面代码:

<h:panelGrid columns="2" columnClasses="height8, height8" rowClasses="height8">
    <h:outputText value="This row"/>
    <h:outputText value=" is ok"/>

    <h:outputText value="This row"/>
    <h:outputText value=" is ok"/>

    <h:outputText value="This row" styleClass="height0"/>
    <h:outputText value=" height should be different" styleClass="height0"/>

    <h:outputText value="This row"/>
    <h:outputText value=" is ok"/>
</h:panelGrid>

样式类height0似乎不适用于此处。如何在h:panelGrid中设置特定行的高度?

2 个答案:

答案 0 :(得分:0)

更改以下样式类应该有效

.height0 tr td{
    height: 0px; //or what ever height you want to set to this row.
}

答案 1 :(得分:0)

你有两种方式:

内联样式:          

<h:outputText value="This row"/>
<h:outputText value=" is ok"/>

<h:outputText value="This row" style="height: 25px"/>
<h:outputText value=" is ok" style="height: 25px"/>

<h:outputText value="This row"/>
<h:outputText value=" is ok"/>

CSS样式:

你的元素应该有一个id:          

<h:outputText value="This row"/>
<h:outputText value=" is ok"/>

<h:outputText value="This row" id="customheight"/>
<h:outputText value=" is ok" id="customheight"/>

<h:outputText value="This row"/>
<h:outputText value=" is ok"/>

并在CSS文件中添加此样式:

#customheight{
   height: 25px;
}