<ice:dataTable>

Front-end
#1

Pessoal tenho que criar uma galeria de fotos. Já tenho o MB que pega as fotos do banco, mostra na tela, porém ele mostra as imagens na seguinte disposição:

As imagens estão aparecendo uma abaixo da outra.

Gostaria de saber como posso colocar isso em 3 colunas.
Segue meu código da página jspx:

<ice:dataTable border="0" width="100%" scrollable="true" scrollHeight="500" id="tabela1" headerClasses="cabecalho" columnClasses="primeiro" var="item1" value="#{GaleriaDAO.galerias[1]}">
                                            <ice:column style="width:100%">
                                                <ice:commandLink action="#{Galeria.view}" ><ice:graphicImage  style="border: 0;" value="#{item1.foto}" height="90" width="120"/><br/>
                                                    <ice:outputText value="#{item1.titulo}"/><br/><br/>
                                                    <f:param id="id" name="id" value="#{item1.codigo}"/>
                                                </ice:commandLink>
                                            </ice:column>
                                        </ice:dataTable>

Desde já agradeço a todos

#2

up!

#3

pessoal, ninguem??

#4

up!

#5

Cole o código HTML gerado nesta página, referente à esta galeria.
Acredito que a solução seja puro CSS.
Mas cole o código para que possamos te ajudar!

#6

[code]






                </table>
            </div>
            <div style="overflow:auto;width:100%;height:500;"><table class="iceDatTblScrlBdyTbl">
                    <tbody>
                        <tr class="iceDatTblRow1" id="j_id100:tabela:0">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:0:j_id103" src="/Gataf_Site/block/resource/LTExNDUzNzY1Nzg=/?17889360" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:0:j_id104"></span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow2" id="j_id100:tabela:1">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:1:j_id103" src="/Gataf_Site/block/resource/MTM0MjEzNjI1NQ==/?18779484" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:1:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow1" id="j_id100:tabela:2">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:2:j_id103" src="/Gataf_Site/block/resource/LTQ2NTMxODIwOA==/?13806908" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:2:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow2" id="j_id100:tabela:3">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:3:j_id103" src="/Gataf_Site/block/resource/MjAyMjE5NDYyNQ==/?23808997" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:3:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow1" id="j_id100:tabela:4">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:4:j_id103" src="/Gataf_Site/block/resource/MjE0NzQwMTYy/?21227447" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:4:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow2" id="j_id100:tabela:5">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:5:j_id103" src="/Gataf_Site/block/resource/LTE1OTI3MTQzMDE=/?18982709" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:5:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow1" id="j_id100:tabela:6">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:6:j_id103" src="/Gataf_Site/block/resource/ODk0Nzk4NTMy/?6857420" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:6:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow2" id="j_id100:tabela:7">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:7:j_id103" src="/Gataf_Site/block/resource/LTkxMjY1NTkzMQ==/?26751898" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:7:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow1" id="j_id100:tabela:8">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:8:j_id103" src="/Gataf_Site/block/resource/MTU3NDg1NjkwMg==/?23327870" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:8:j_id104">

                                </span>
                            </td>
                        </tr>
                        <tr class="iceDatTblRow2" id="j_id100:tabela:9">
                            <td class="iceDatTblCol primeiro" style="width:100%;overflow:hidden;">
                                <img alt="" class="iceGphImg" height="90" id="j_id100:tabela:9:j_id103" src="/Gataf_Site/block/resource/LTIzMjU5NzU2MQ==/?21527784" style="border: 0;" width="120" />
                                <span class="iceOutTxt" id="j_id100:tabela:9:j_id104">

                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </td>
</tr>
[/code]

Como pedido esta aí. (Pegei apenas a parte das imagens, para não ficar muito grande o post mas se precisar da página completa, só pedir)
Obrigado pela resposta
#7

Cara, é o seguinte: como você vê, ele renderizou as imagens através de linhas (rows)!

Desconheço algum CSS hack para exibir várias linhas na mesma linha, aliás, isso com certeza seria uma POG. Não faz sentido juntar linhas de uma tabela.

Bom, não conheço o ICEFaces, porém com RichFaces a resolução deste problema seria simples, sendo necessário apenas utilizar um DataGrid. Procure algum componente similar, é o correto! Exemplo:

http://livedemo.exadel.com/richfaces-demo/richfaces/dataGrid.jsf?c=dataGrid&tab=usage

Falow!

#8