p：間隔寬度根據屏幕分辨率變化

我在我的xhtml文件中使用p:spacer在面板網格左側創建一些空白空間，右側有兩個按鈕。對齊方式對於分辨率（1366 X 768屏幕）工作良好。但是，如果使用IE 10瀏覽器在分辨率爲1280 X 1024的屏幕上打開該頁面，則左側空間會增大，右側按鈕將不再顯示，並且會出現一個水平滾動條。我不希望用戶滾動查看按鈕。示例代碼如下。p：間隔寬度根據屏幕分辨率變化

<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。

來源

2014-09-24 Coder4Jsf

我不會推薦使用p:spacer作爲這種特殊情況。相反，你可以玩風格來實現你想要做的事情。這將工作：

使用這種風格（把它無論你有你的CSS）：

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

而在p:panelGrid的styleClass和columnClasses屬性像這樣使用它：

<p:accordionPanel value="#{dataBean.userList}" var="j" activeIndex="null"> 
    <p:tab title="#{j.department} - #{j.userCount}"> 
     <p:panelGrid columns="2" styleClass="grid" columnClasses="column1,column2"> 
      <p:column></p:column> 
      <p:column> 
       <p:commandButton value="hi"/> 
       <p:commandButton value="bye"/> 
      </p:column> 
     </p:panelGrid> 
    </p:tab> 
</p:accordionPanel>

通過這種方式，您的第一列將佔用所有可用空間，使第二列的按鈕與右側對齊，而不依賴於分辨率。

來源

2014-09-25 11:00:42 mrganser

p：間隔寬度根據屏幕分辨率變化

回答

相關問題