Bonjour,
Alors voilà je rencontre des soucis quant à l'aspect responsive de mes "tableaux". J'ai créé des div qui contiennent des images ainsi que des textes qui sont disposés sur les côtés droits des images, sauf que je n'arrive pas à rendre cela responsive.. lorsque je le rentre sur Email On Acid pour le tester sur tous les formats, ça ne fonctionne pas comme je le souhaite. Cela dépasse totalement du cadre voulu. Je ne sais pas d'où vient le problème.. Mon cadre de base qui contient le code est un tableau de 650px maximum, je n'ai aucun souci pour faire rentrer du texte en dehors du code collé en dessous, tout le reste est responsive, à part le code que je vous donne. Je ne sais pas quoi faire. Il y a-t-il du code à rajouter pour qu'il s'adapte à l'écran ?
Voici mon code :
Qui est censé donner ceci :
Mon but est simplement de ne pas faire dépasser le texte hors du cadre..
Modifié par Ellydia (09 Apr 2020 - 11:47)
Alors voilà je rencontre des soucis quant à l'aspect responsive de mes "tableaux". J'ai créé des div qui contiennent des images ainsi que des textes qui sont disposés sur les côtés droits des images, sauf que je n'arrive pas à rendre cela responsive.. lorsque je le rentre sur Email On Acid pour le tester sur tous les formats, ça ne fonctionne pas comme je le souhaite. Cela dépasse totalement du cadre voulu. Je ne sais pas d'où vient le problème.. Mon cadre de base qui contient le code est un tableau de 650px maximum, je n'ai aucun souci pour faire rentrer du texte en dehors du code collé en dessous, tout le reste est responsive, à part le code que je vous donne. Je ne sais pas quoi faire. Il y a-t-il du code à rajouter pour qu'il s'adapte à l'écran ?
Voici mon code :
<div style="background-color: #1177bc; width:650px; margin:0px auto; max-width:650px; padding-top:20px; padding-bottom: 20px ">
<div style="float:left">
<img src="images-comp/coins.png" alt="" border="0" width="100" height="100" style="display:block; padding: 0px 30px 30px 30px; margin-top:10px; " /></div>
<div style="background-color: #1177bc; float:left; font-family: Helvetica, arial, sans-serif; font-size: 21px; color: white; text-align:justify; line-height: 24px; font-weight: bold; background-color: #eb212d; padding-top: 5px; padding-bottom: 5px; padding-left: 10px; padding-right: 30px; max-width:500px">Mon texte</div>
<br><br>
<p style="max-width:550px; background-color: #1177bc; font-family: Helvetica, arial, sans-serif; font-size: 18px; color: white; text-align:justify; line-height: 24px; padding-left: 10px; padding-right: 10px;" >Petit texte à entrer ici </p>
</div>Qui est censé donner ceci :
Mon but est simplement de ne pas faire dépasser le texte hors du cadre..
Modifié par Ellydia (09 Apr 2020 - 11:47)