Question

我在我的xhtml文件中使用p:spacer在Panel Grid的左侧创建一些空白区域，右侧我有两个按钮。对齐适用于分辨率（1366 X 768屏幕）。但是如果使用IE 10浏览器在分辨率为1280 X 1024的屏幕上打开页面，左侧空间会增加，右侧按钮会离开视图，并出现水平滚动条。我不希望用户滚动查看按钮。示例代码如下。

<p:accordionPanel value="#{dataBean.userList}" var="j" activeIndex="null">
   <p:tab title="#{j.department} - #{j.userCount}">
   <p:panelGrid columns="2">
   <p:column>
      <p:spacer width="1050" height="5" />
   </p:column>
   <p:column>

如何根据分辨率调整将调整的空间？

使用PrimeFaces 4.0。

Answer 1

我不建议在特定情况下使用p:spacer。相反，您可以使用样式来实现您想要做的事情。这将有效：

使用这种风格（把它放在你的css的任何地方）：

<style type="text/css">
    .grid{width: 100%;}
    .column1{width: 100%;}
    .column2{}
</style>

并在styleClass的{{1}}和columnClasses属性中使用它，如下所示：

p:panelGrid

这样，您的第一列将占用所有可用空间，而第二列按钮与右侧对齐，而不依赖于分辨率。

p：间隔宽度根据屏幕分辨率而变化

1 个答案: