Bonjour,

J'ai conçu une page web avec XHtml et CSS, mais elle ne s'affiche pas correctement sur téléphone portable.

Sur portable, voici comment elle s'affiche :

http://image.noelshack.com/fichiers/2017/03/1484899552-x1.png

Et voici comment elle devrait s'afficher :

http://image.noelshack.com/fichiers/2017/03/1484899623-x2.png

J'ai remarqué que sur portable, la ligne float:right; était ignorée dans mon CSS, quelqu'un sait-il m'expliquer pourquoi, svp ?

Code XHtml de la page : http://pastebin.com/bH9a5Ykt

Code CSS de la page : http://pastebin.com/0vmtJh1r

Un tout grand merci à ceux qui pourront m'aider, svp !

Bonjour,

La largeur de tes éléments étant en pixel lorsque tu rétrécis ton écran il n'y a plus la place, donc le navigateur effectue des sauts de lignes. Tu as donc deux alternatives. Modifier la width de tes éléments en CSS pour les mettre en %.

Ou alors, seconde option, mettre en place une/des média(s) queries te permettant d'adapter le contenu en fonction de la hauteur ou de la largeur de l'écran.

Si tu optes pour la seconde option, voici un très bon tuto : https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3/mise-en-page-adaptative-avec-les-media-queries

-
Edité par Sixoren 20 janvier 2017 à 11:37:42