Évolutions & Bugs

Ce problème a été rapporté dans un autre ticket via un commentaire mais je préfère le rajouter ici pour que d'autres soient au courant.

En ce moment, les pages contenant des tableaux ont 50% de chance d'être déformées sur iPhone et ainsi décaler la présentation générale de la page.

Le tableau a tendance à déborder sur le fond de page.

Voici une illustration du problème :

Salut Nico, j'ai corrigé le problème de tableaux sur la page des tickets, à présent ça cache certaines colonnes automatiquement lorsque l'écran n'est pas assez large. Pour ton autre capture, il faut modifier le tableau en mettant moins de cases par ligne.

Sur la page source (en visualisant sur un ordinateur, le tableau de la saison 4 ne prend que la moitié de la colonne de l'éditorial... Je vais pas changer pour mettre 1/4 de la colonne quand même ! xD

Voici le lien → https://hawaii-5-0.hypnoweb.net/

En fait ça ne fait pas réellement de sens d'utiliser un tableau (qui doit servir à de la présentation de données structurées) pour faire un menu. Peux-tu le remplacer par du texte ? Par exemple "Saison 4 | Photos BTS | Episodes ..."

Et n'oublie pas de me réassigner les tickets quand tu réponds ;)

Ben justement, si j'utilise le tableau, c'est pour... structurer... Dès qu'on met une valeur pour la bordure, ça bousille la présentation sur iPhone et ça dépasse sur le côté en fait... Pas pratique du tout là.

C'est seulement dans le cas où tu mets une bordure ? La seule "solution" que je verrais serait de cacher la partie qui sort du cadre pour ne pas qu'elle s'affiche sur la colonne de droite. Mais dans ce cas une partie du texte serait invisible sur mobile...

Je viens de faire un essai en cachant ce qui dépasse, qu'en penses-tu ?

Sur les dernières modification apportées, voici les conséquences : que ce soit en mode paysage ou en mode portrait, le tableau est maintenant coupé sur le côté (il ne dépasse pas le cadre qui délimite l'éditorial) et il n'y a plus de déformation de la page avec apparition du fonds d'étoiles. Le site reste correctement visible sur l'iPhone sans qu'on apercoive le fond de page. Maintenant, c'est dommage que le tableau soit coupé comme ça... Mais bon...

Il faut éviter de faire des tableaux avec beaucoup de colonnes car ils ne s'afficheront pas en entier sur le mobile. Je n'ai pas de solution et le seul moyen que j'ai trouvé pour la liste des tickets est de cacher certaines colonnes. Du coup, je te propose de ne pas utiliser des tableaux pour des menus, mais de les mettre sous forme de texte.

Et pour ceux qui veulent plus d'informations sur la manière de gérer les tableaux structurés sur mobile, voici un article intéressant : https://css-tricks.com/responsive-data-tables/

Remarque prise en compte. Ce qui est étonnant, c'est que sur le site en version ordinateur, le tableau ne prend que la moitié de la largeur de l'éditorial...