rob_php 0 Denunciar post Postado Março 22, 2017 Bom dia pessoal, preciso retornar dados vindos do banco de dados para a tela, mas para isso preciso utilizar divs, pois isso não gera quebra de linhas ao acessar a informação no mobile. Alguém poderia me dar uma sugestão de como utilizar o exemplo abaixo com divs ? <div class="panel panel-light" style="background-color: #ff7519;"> <div class="panel-heading"><center><h4>Lista Pedidos 24 horas</h4></center></div> <table class="table table-striped table-condensed table-bordered"> <thead> <tr> <td> <b><font color="#00008f">Nome</font></b> </td> <td> <b><font color="#00008f">Email</font></b> </td> <td> <b><font color="#00008f">Restaurante</font></b> </td> <td> <b><font color="#00008f">Status</font></b> </td> <td> <b><font color="#00008f">Horário feito</font></b> </td> <td> <b><font color="#00008f">Horário aceito</font></b> </td> </tr> </thead> Compartilhar este post Link para o post Compartilhar em outros sites
Bergs 53 Denunciar post Postado Março 22, 2017 Normalmente usa-se uma barra de rolagem horizontal na tabela. Mas quando for na versão mobile você troca (via media querie) a table por suas divs como se fossem listas cada coluna. Compartilhar este post Link para o post Compartilhar em outros sites
rob_php 0 Denunciar post Postado Março 22, 2017 Teria como me mostrar um exemplo desse preenchimento com divs ou me apontar algum link que demonstre isso, desde já obrigado. Compartilhar este post Link para o post Compartilhar em outros sites
Bergs 53 Denunciar post Postado Março 22, 2017 Visualize cada div como se fosse uma coluna de sua tabela daí é só popular ela, e fazer aparecer pelo CSS. <div> <center><h4>Lista Pedidos 24 horas</h4></center> </div> <div class="coluna1">titulo <br/> iten1 <br> iten2 .... .. ..</div> <div class="coluna2">titulo <br/> iten1 <br> iten2 .... .. ..</div> <div class="coluna3">titulo <br/> iten1 <br> iten2 .... .. ..</div> Compartilhar este post Link para o post Compartilhar em outros sites
Guilherme Luiz 41 Denunciar post Postado Março 22, 2017 utilize um framework para facilitar a sua vida. O bootstrap é muito bom, fácil, leve e é mobile-first. http://getbootstrap.com/getting-started/ Compartilhar este post Link para o post Compartilhar em outros sites
Bergs 53 Denunciar post Postado Março 22, 2017 24 minutos atrás, Guilherme Luiz disse: utilize um framework para facilitar a sua vida. O bootstrap é muito bom, fácil, leve e é mobile-first. http://getbootstrap.com/getting-started/ Pelo código dele acho que já utiliza. pelas tags as classes da tabela dele. table table-striped table-condensed table-bordered Compartilhar este post Link para o post Compartilhar em outros sites
Eziquiel 96 Denunciar post Postado Março 22, 2017 Talvez algo assim pode ser a solução: (Clique no nome para exibir as demais informações). No local do nome coloque a informação mais importante. http://codepen.io/Eziquiel/pen/ZexdWL?editors=0100 Compartilhar este post Link para o post Compartilhar em outros sites
Bergs 53 Denunciar post Postado Março 22, 2017 1 hora atrás, Eziquiel disse: Talvez algo assim pode ser a solução: (Clique no nome para exibir as demais informações). No local do nome coloque a informação mais importante. http://codepen.io/Eziquiel/pen/ZexdWL?editors=0100 Muito bom. Compartilhar este post Link para o post Compartilhar em outros sites
