Gebruiker:IdP/kladblok34

Tabllen responsive maken

Op mobiel zijn tabellen niet automatisch responsive en dat kan voor de rest van de opmaak van een pagina gevolgen hebben. Er zijn verschillen manieren om ervoor te zorgen dat tabellen ok op mobiel responsive reagere en dat de rest van de layout naar wens blijft.

Tabllen in een div zetten:

<div class="table-responsive">
 --- table

</div><!-- eof table-responsive -->

Of

<div style="overflow-x: auto;">
--- table
</div><!-- eof table-responsive -->

In Reprise Top 25

Op de pagina in de card-body onderstaande html opgenomen:

<div class="row my-4" style="overflow-x: auto; max-width: 100%;">
<div class="col-12" style="min-width: 600px;">
{{Overzicht InReprise|25}}
</div><!-- eof col-12 -->
</div><!-- eof row -->

In Reprise Top 25 - Overzicht

Een extra style toegevoegd aan deze querie:

{| class="table table-striped sortable" style="overflow-x: auto; max-width: 100%;"
 |+ In Reprise {{{1|}}}
 ! Stuk !! Auteur !! Premièredatum
 |-
 ---
|}

Stambomen