Question

例如，现在我正在尝试将panelGrid添加到包含X按钮的页面。每个按钮具有不同的长度，具体取决于文本与其关联的时间长度。我希望能够在panelGrid级别指定，以确保每个组件都伸展以满足panelGrid本身的宽度 - 而不必手动设置X个按钮的宽度。

它必须与columnClasses相关并通过CSS设置宽度，但我所做的尝试不起作用。例如，我将panelGrid上的styeClass设置为宽度为100px的类。然后我尝试将ColumnClass设置为该CSS类 - 仍然没有骰子。

思想？

Answer 1

对于此panelGrid ...

  <h:panelGrid styleClass="panelGridClass" columns="2">
    <h:commandButton value="b1" />
    <h:commandButton value="button 2" />
    <h:commandButton value="button 3 is really long" />
    <h:commandButton value="b4" />
  </h:panelGrid>

您可以使用此CSS将按钮设置为相等的宽度：

TABLE.panelGridClass {
    width: 300px;
}
TABLE.panelGridClass TR TD {
  width: 50%;
}
TABLE.panelGridClass TR TD INPUT {
    width: 95%;
}

这将表格设置为300像素宽，单元格为表格宽度的一半，以及用于占据大部分单元格宽度的按钮。如果按钮的自然长度超过150px，则列的宽度可能不同，但您可以使用溢出规则或其他东西来克服这些。

JSF CSS panelGrid - 如何使其包含的元素都是常量宽度

1 个答案: