Me gustaría que mi tabla responsiva tuviese un mejor aspecto
Estoy creando una aplicación web para la cual uso tablas que necesito que sean responsive.
A tamaño de visualización de un ordenador, la vista es esta:
Y a vista de movil es esta:
Me gustaría que en esta segunda vista pudiese ver también los campos fijos, agua luz gas etc, todos los campos.
Os dejo mi código para que me podáis ayudar:
<section class="hero-banner magic-ball" id="pagos"> <div class="row align-items-center text-center text-md-center" > <div class="col-md-8 col-lg-5 mb-5 mb-md-0" > <h2>Gestión de pagos:</h2> <div class="table-responsive"> <table class="table table-bordered table-striped" width="500" style="margin-left: 100px; "> <thead class="thead-dark"> <tr> <th >Mes</th> <th >Valor</th> <th >Luz</th> <th >Agua</th> <th >Gas</th> <th >Total</th> <th >Pagado</th> </tr> </thead> <?php $sqletotal= $sqle["Valor"]+$sqle["Luz"]+$sqle["Agua"]+$sqle["Gas"]; echo "<tbody><tr><th >".$sqle["Mes"]."</th><td>".$sqle["Valor"] . "</td><td>".$sqle["Luz"] ."</td><td>".$sqle["Agua"] ."</td><td>".$sqle["Gas"] ."</td><td>".$sqletotal ."</td><td>".$sqle["Cobrado"] ."</td></tr>" ; if (mysqli_num_rows( $sqlw) > 0 ) { while($sqlr = mysqli_fetch_assoc($sqlw)) { $sqltotal= $sqlr["Valor"]+$sqlr["Luz"]+$sqlr["Agua"]+$sqlr["Gas"]; echo "<tr><th>" .$sqlr["Mes"] . "</th><td>".$sqlr["Valor"] . "</td><td>".$sqlr["Luz"] ."</td><td>".$sqlr["Agua"] ."</td><td>".$sqlr["Gas"] ."</td><td>".$sqltotal ."</td><td>".$sqlr["Cobrado"] ."</td></tr>" ; }}?> </tbody> </table> </div> </div></div> </section>