Jump to content

Recommended Posts

Bonjour à tous, 

Google n'aime pas ma nouvelle page cms https://shopnature.fr/content/14-utilisation-des-huiles-vegetales

Il me reproche un contenu plus large que l'écran , texte illisible, et éléments cliquables trop rapprochés.

Comment puis -je faire pour que mon tableau devienne responsive?

Je peux agrandir la police et espacer les liens mais cela agrandira davantage le tableau.

Si quelqu'un a une idée .

Merci d'avance 

Aurélia

 

 

Edited by Aurélia222
résolu (see edit history)

Share this post


Link to post
Share on other sites

Bonjour,

il faut mettre des media queries pour dire comment ton tableau doit s'afficher en fonction des tailles d'écrans.

Regarde par ici, le sujet est traité https://forum.alsacreations.com/topic-27-77755-1-Rendre-un-tableau-html-responsive.html

Sinon, regarde sur ces résultats https://www.google.com/search?q=tableau+responsive&rlz=1C1CHBF_frFR784FR784&oq=tableau+responsive&aqs=chrome..69i57.3884j0j7&sourceid=chrome&ie=UTF-8

  • Like 1

Share this post


Link to post
Share on other sites

Bonjour SK3uD,

merci bcp pour ton aide mais j'ai regardé et ça m'a paru trop compliqué car je ne maîtrise pas le vocabulaire , ihihihihihi!!!

Du coup j'ai retiré mon tableau et laisser uniquement le texte.

C'est sur que ça fait moins propre coté client mais au moins google sera satisfait  lol 

merci quand même ;)

Share this post


Link to post
Share on other sites

Pourrais-tu me donner l'ancien code avec le tableau ?

Share this post


Link to post
Share on other sites

j'aurais modifié le code pour qu'il s'affiche correctement sur mobile.

  • Like 1

Share this post


Link to post
Share on other sites

c'est vraiment sympa de votre part :)

je veux bien !

je vous le remets  en format tableau et vous fourni le code  dès que possible.

encore merci

  • Like 1

Share this post


Link to post
Share on other sites

Voici le code source  depuis la page cms :

<h1 style="text-align: left;"><strong><span style="color: #218e53;">Utilisation, caractéristiques et huiles végétales conseillées</span></strong></h1>
<p></p>
<p>Voici un document pour vous aider à choisir quelles sont les huiles végétales qui vous correspondent. Ensuite vous n'avez plus qu'à cliquer sur l'huile qui correspond.<strong><span style="color: #218e53;"></span></strong></p>
<table width="1001" cellpadding="3" style="height: 556px; width: 993px; margin-left: auto; margin-right: auto;" border="2">
<tbody>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau normale</strong></td>
<td style="text-align: center;">Lisse, confortable, élastique, fine, aspect mat et grain de peau régulier</td>
<td style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=argan" style="text-align: center;">Argan</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: center;">Jojoba</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Macadamia" style="text-align: center;">Macadamia</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau sèche</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Grain de peau fin, manque d'éclat, parfois irritée, inconfortable, peau fine et peu  élastique</span></td>
<td style="text-align: center;">
<p><a href="https://shopnature.fr/recherche?controller=search&s=Amande+douce" style="text-align: center;">Amande douce</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=argan" style="text-align: center;">Argan</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Avocat" style="text-align: center;">Avocat</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Baobab" style="text-align: center;">Baobab</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Bourrache" style="text-align: center;">Bourrache</a><span style="text-align: center;"> /  </span><a href="https://shopnature.fr/recherche?controller=search&s=Carthame" style="text-align: center;">Carthame</a><span style="text-align: center;"> / </span></p>
<p><a href="https://shopnature.fr/recherche?controller=search&s=Coco" style="text-align: center;">Coco</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Germe+de+bl%C3%A9+" style="text-align: center;">Germe de blé</a><span style="text-align: center;">  / </span><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: center;">Jojoba</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Macadamia" style="text-align: center;">Macadamia</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="text-align: center;">Nigelle</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></p>
</td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau sèche et sensible</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau sèche avec rougeurs, intolérances aux variations de  températures, émotions ... </span></td>
<td style="text-align: center;">
<p><a href="https://shopnature.fr/recherche?controller=search&s=Amande+douce" style="text-align: center;">Amande douce</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Baobab" style="text-align: center;">Baobab</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Germe+de+bl%C3%A9+" style="text-align: center;">Germe de blé</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: center;">Jojoba</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="text-align: center;">Nigelle</a><span style="text-align: center;"> / </span></p>
<p><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></p>
</td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau mixte</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau grasse sur la zone "T" et peau plus sèche  sur les joues, le cou et le contour des yeux</span></td>
<td style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: center;">Jojoba</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="text-align: center;">Nigelle</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau grasse</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau épaisse et élastique, grain de peau irrégulier, pores dilatés et visibles, aspect brillant et luisant, présences éventuelles d'imperfections </span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba">Jojoba</a> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="text-align: center;">Nigelle</a><span style="text-align: center;"> </span><span style="text-align: center;">/ </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau grasse et sensible</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau épaisse et élastique, grain de peau irrégulier, pores dilatés et visible, aspect brillant et luisant , présence d'imperfections et de rougeurs et sensations de brûlures</span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba">Jojoba</a> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="text-align: center;">Nigelle</a><span style="text-align: center;"> </span><span style="text-align: center;">/ </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau à problèmes</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau grasse fréquemment sujette aux imperfections telles que comédons, acné et excès de sébum sévère</span></td>
<td style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Calophylle" style="text-align: center;">Calophylle</a><span style="text-align: center;"> / <a href="https://shopnature.fr/recherche?controller=search&s=Jojoba">Jojoba</a> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="text-align: center;">Nigelle</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Pour les bébés</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau relativement sensible, parfois sèche, douce et fine</span></td>
<td style="text-align: center;"><span style="text-align: center;"> </span><a href="https://shopnature.fr/recherche?controller=search&s=Amande+douce" style="text-align: center;">Amande douce</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=argan" style="text-align: center;">Argan</a><span style="text-align: center;">  / </span><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: center;">Jojoba</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau couperosée</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Présence de vaisseaux dilatés (rougeurs) en particulier sur les joues</span></td>
<td style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Calophylle" style="text-align: center;">Calophylle</a><span style="text-align: center;"> </span><span style="text-align: center;">/ </span><a href="https://shopnature.fr/recherche?controller=search&s=Carthame" style="text-align: center;">Carthame</a><span style="text-align: center;">  / </span><a href="https://shopnature.fr/recherche?controller=search&s=Germe+de+bl%C3%A9+" style="text-align: center;">Germe de blé</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Macadamia">Macadamia</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Prévention de l'âge</strong></td>
<td style="text-align: center;"><span style="text-align: center;">Prévenir et ralentir les effets du temps sur la peau</span></td>
<td style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=argan" style="text-align: center;">Argan</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Bourrache" style="text-align: center;">Bourrache</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Carthame" style="text-align: center;">Carthame</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Peau mature</strong><strong style="text-align: center;"></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau en général sèche, déshydratée, plus ou moins sensible, avec perte de souplesse, d'élasticité, teint terne et présence de rides et ridules. Peau fine et rêche au toucher</span><br /><span style="text-align: center;"></span></td>
<td style="text-align: center;">
<p><a href="https://shopnature.fr/recherche?controller=search&s=argan" style="text-align: center;">Argan</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Avocat" style="text-align: center;">Avocat</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Baobab" style="text-align: center;">Baobab</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Bourrache" style="text-align: center;">Bourrache</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Carthame" style="text-align: center;">Carthame</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: center;">Jojoba</a><span style="text-align: center;"> / </span></p>
<p><a href="https://shopnature.fr/recherche?controller=search&s=Macadamia" style="text-align: center;">Macadamia</a><span style="text-align: center;"> </span><span style="text-align: center;"></span></p>
</td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Tâches de </strong><b style="text-align: center;">vieillesse</b><strong style="text-align: center;"></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Tâches pigmentées apparues avec le temps et l'exposition au soleil</span><span style="text-align: center;"></span></td>
<td style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="text-align: center;">Nigelle</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Ricin" style="text-align: center;">Ricin</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: center;">Rose musquée</a><span style="text-align: center;"></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;">Grossesse et </strong><b style="text-align: center;">vergetures</b><strong style="text-align: center;"></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Besoin d'hydratation et d'élasticité</span><span style="text-align: center;"></span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=argan">Argan</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Avocat">Avocat</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Germe+de+bl%C3%A9+">Germe de blé</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Macadamia">Macadamia</a> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e">Rose musquée</a><span style="text-align: center;"></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><strong>Cellulite</strong></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Cellulite résistante (faciliter son élimination par le massage) </span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Carthame">Carthame</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba">Jojoba</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Macadamia">Macadamia</a></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><strong>Bronzage</strong></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Prépare la peau à l'exposition solaire et facilite le bronzage </span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Avocat">Avocat</a><span> / <a href="https://shopnature.fr/recherche?controller=search&s=Carotte">Carotte</a></span></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><strong>Protection UV</strong></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Pour préparer la peau à l'exposition solaire. Chaque huile possède  un indice de protection plus ou moins élevé </span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Beurre+de+Karit%C3%A9+">Beurre de Karité</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Jojoba">Jojoba</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Macadamia">Macadamia</a></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><b>Coup de soleil</b></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau sensibilisée, chaude, douloureuse</span></td>
<td style="text-align: center;">
<p><span style="text-align: center;"><span><a href="https://shopnature.fr/recherche?controller=search&s=Avocat">Avocat</a> /<a href="https://shopnature.fr/recherche?controller=search&s=Beurre+de+Karit%C3%A9+">Beurre de Karité</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Calendula">Calendula</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Coco">Coco</a> / <a href="https://shopnature.fr/recherche?controller=search&s=Macadamia">Macadamia</a> / </span></span></p>
<p><span style="text-align: center;"><span><a href="https://shopnature.fr/recherche?controller=search&s=Millepertuis">Millepertuis</a> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e" style="text-align: left;">Rose musquée</a></span></p>
</td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><b>Cicatrices</b></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Cicatrices récentes à atténuer</span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=argan">Argan</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Macadamia">Macadamia</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Rose+musqu%C3%A9e">Rose musquée</a></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><b><strong>Cheveux</strong></b></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Cheveux secs, ternes, difficiles à coiffer</span></td>
<td style="text-align: center;">
<p><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Amande+douce" style="background-color: #ffffff;">Amande </a><a href="https://shopnature.fr/recherche?controller=search&s=Amande+douce">douce</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=argan">Argan</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Avocat">Avocat</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Baobab">Baobab</a><span> </span><span>/</span><span> </span><a href="https://shopnature.fr/recherche?controller=search&s=Bourrache">Bourrache</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Carthame" style="text-align: left;">Carthame</a><span style="text-align: left;"> / </span></span></p>
<p><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Coco" style="text-align: left;">Coco</a><span style="text-align: left;"> / </span></span><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: left;">Jojoba</a><span style="text-align: left;"> / </span></span><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=Macadamia" style="background-color: #ffffff;">Macadamia</a><span style="background-color: #ffffff;"> /</span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle" style="background-color: #ffffff;">Nigelle</a><span style="background-color: #ffffff;"> / </span></span><a href="https://shopnature.fr/recherche?controller=search&s=Ricin" style="background-color: #ffffff;">Ricin</a></p>
</td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><b><strong style="text-align: left;">Ongles </strong><strong style="text-align: left;">cassants</strong></b></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Ongles cassants, striés, dédoublés, mous ... (Améliorer l'aspect général des ongles)</span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=argan">Argan</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Baobab">Baobab</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Bourrache">Bourrache</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Carthame">Carthame</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Nigelle">Nigelle</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Olive">Olive</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Ricin">Ricin</a><span> </span></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><b><strong>Mains et pieds</strong></b></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Peau sèche ou très sèche, avec crevasses et autres callosités </span></td>
<td style="text-align: center;"><span style="text-align: center;"><a href="https://shopnature.fr/recherche?controller=search&s=argan">Argan</a><span> /</span><a href="https://shopnature.fr/recherche?controller=search&s=Beurre+de+Karit%C3%A9+">Beurre de Karité</a><span> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Coco">Coco</a></span></td>
</tr>
<tr>
<td style="text-align: center;"><strong style="text-align: center;"><b><strong>Contre les poux</strong></b></strong></td>
<td style="text-align: center;"><span style="text-align: center;">Présence de poux et lentes dans les cheveux</span></td>
<td style="text-align: center;"><span style="text-align: center;"><span style="text-align: center;"></span></span>
<p style="text-align: left;"><a href="https://shopnature.fr/recherche?controller=search&s=Amande+douce" style="text-align: center;">Amande douce</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Coco" style="text-align: center;">Coco</a><span style="text-align: center;">  / </span><a href="https://shopnature.fr/recherche?controller=search&s=Jojoba" style="text-align: center;">Jojoba</a><span style="text-align: center;"> / </span><a href="https://shopnature.fr/recherche?controller=search&s=Olive" style="text-align: center;">Olive</a><span style="text-align: center;"> (à compléter avec </span>des</p>
<p style="text-align: left;">Huiles essentielles de tea tree et/ou Lavandin, 20 min de pause)</p>
<span style="text-align: center;"><span style="text-align: center;"></span></span>
<p></p>
</td>
</tr>
</tbody>
</table>
<p style="text-align: left;"></p>
<p style="text-align: left;"></p>
<p style="text-align: left;"></p>
<p style="text-align: left;"></p>
<p style="text-align: left;"></p>
<p></p>
<p></p>

 

encore merci ;)

 

Share this post


Link to post
Share on other sites

Bon, comme d'habitude, je prends le chemin le plus compliqué. En fait, il n'y a qu'une seul ligne à modifier pour que le tableau s'adapte à la page. 

<table width="1001" cellpadding="3" style="height:556px;width:993px;margin-left:auto;margin-right:auto;" border="2">

Vous remplacez les valeurs en px par des valeurs en %. Comme ceci par exemple :

<table cellpadding="3" style="width:90%;margin-left:auto;margin-right:auto;" border="2">

J'ai volontairement enlevé le width="1001" parce que j'ai mis une taille dans la partie style="..."

  • Thanks 1

Share this post


Link to post
Share on other sites

super ça fonctionne 

ça a rajouté une barre de défilement pour voir ce qui était à droite 

encore merci pour votre aide 

Share this post


Link to post
Share on other sites

Ajoute ce code au dessus du code de ton tableau, avant <table>

 

<style>
    @media screen and (max-width: 640px) {
  table,
  tbody,
  tr,
  td {
    display: block;
    width: auto!important;
  }
}
</style>

Je sais que !important c'est pas terrible mais on fera avec :(

Edited by SK3uD (see edit history)

Share this post


Link to post
Share on other sites

j'ai rajouté le code mais je ne vois pas la différence.

fallait peut être mettre un autre mot à la place d'important ?

désolé j'ai pas tout compris 

Share this post


Link to post
Share on other sites

j'ai vérifié , je mets le code , j'enregistre mais le code disparaît à chaque fois 

Share this post


Link to post
Share on other sites
<style>
    @media screen and (max-width: 640px) {
  table,
  tbody,
  tr,
  td {
    display: block;
    width: auto!important;
  }
}
</style>

Le code ci-dessus est à ajouter au-dessus de la balise <table cellpadding....>

Share this post


Link to post
Share on other sites

ah oui ... les pages CMS. 

IL faut donc ajouter ce code sur le fichier cms.css de votre thème.

@media screen and (max-width: 640px) {
  table,
  tbody,
  tr,
  td {
    display: block;
    width: auto!important;
  }
}

 

Share this post


Link to post
Share on other sites

/themes/classic/assets/css/custom.css

Sur ce fichier ça ira. 

Share this post


Link to post
Share on other sites

Dans le fichier css, il faut enlever <style> et </style> ;)

Share this post


Link to post
Share on other sites

c'est bon ça fonctionne 

ça a modifier le tableau en colonne 

en tout cas merci bcp pour votre patience 

Share this post


Link to post
Share on other sites

C'est le but des forums. Je demande assez d'aide pour en donner quand j'en ai la possibilité.

Share this post


Link to post
Share on other sites

En tout cas c'est vraiment sympa,

c'est Google qui va être satisfait ;)

encore merci et très bonne soirée 

  • Like 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More