JSF/XHTML/CSS'；tableview'；提琴_Css_Jsf_Jsf 2

JSF/XHTML/CSS'；tableview'；提琴

css jsf jsf-2

JSF/XHTML/CSS'；tableview'；提琴,css,jsf,jsf-2,Css,Jsf,Jsf 2,我目前正在尝试遍历一个列表，该列表将为每个值生成一个（…）。这些div将表示为“块”（如下图所示）。问题是，我需要它们像一行一样对齐（所以新行从上一行的最低点开始）这在每行使用容器div时不会有问题，如下所示： <div> <div>(...)</div> <div>(...)</div> <div>(...)</div> </div> <div> &l

我目前正在尝试遍历一个列表，该列表将为每个值生成一个

（…）

。这些div将表示为“块”（如下图所示）。问题是，我需要它们像一行一样对齐（所以新行从上一行的最低点开始）

这在每行使用容器div时不会有问题，如下所示：

<div>
    <div>(...)</div>
    <div>(...)</div>
    <div>(...)</div>
</div>
<div>
    <div>(...)</div>
    <div>(...)</div>
    <div>(...)</div>
</div>


(...)
(...)
(...)
(...)
(...)
(...)

尽管我不希望使用容器div，因为我需要在

（…）

中使用某些逻辑，以便在每三个条目上添加

我也在JSF下发布这篇文章，因为我希望JSF（或PrimeFaces或Tomahawk）有一个合适的解决方案。不过，如果一个简单的CSS技巧就足够了，那就太完美了

希望你能帮我解决这个问题

注意：使用表的解决方案对我没有帮助，因为我在使用

（…）

时会遇到与上述容器div相同的问题。

不使用表有语义原因吗？使用

和

的组合，这很容易实现


#{item}

它是这样工作的，因为

在视图构建期间运行，并有效地生成多个

组件，以便它们正确地结束为

的一个单元。当使用

时，它不会起作用，因为它只在视图渲染期间运行，并且在视图构建期间有效地结束为

的单个单元格

如果有一个强有力且有效的语义理由不使用表，那么您真的无法很好地绕过容器

来表示一行

<div>
    <ui:repeat value="#{bean.items}" var="item" varStatus="loop">
        <h:outputText value="&lt;/div&gt;&lt;div&gt;" escape="false" rendered="#{not loop.first and loop.index % 3 == 0}" />
        <div>#{item}</div>
    </ui:repeat>
</div>


#{item}

另见：

不使用表有语义上的原因吗？使用

和