- WordPress :6.7
- Statut : non résolu
- Ce sujet contient 4 réponses, 2 participants et a été mis à jour pour la dernière fois par
, le il y a 1 mois.
-
Messages
-
Bonjour,
Ma configuration WP actuelle
- Thème utilisé : Twenty Twenty-Four
- Extensions en place : Smart Slider 3
- Nom de l’hébergeur : ovh
- Adresse du site : ici
Problème(s) rencontré(s) :
Je rencontre 2 problèmes d’affichage.
- Sur cette page j’ai fait des colonnes de quatre pour afficher des images.Sur ordinateur ça s’affiche super bien seulement sur téléphone je voudrais les rendre visible deux par deux. J’ai essayé plusieurs prototypes mais je n’y arrive pas. Comment puis-je faire pour qu’il soit visible par quatre sur ordinateur et par deux sur un téléphone ?
https://i.ibb.co/Mk3yH0pH/Capture-d-e-cran-2025-06-14-a-08-52-33.png
2. Toujours sur téléphone, je rencontre un problème au niveau du footer, tout est décalé.
https://i.ibb.co/bMD7gV17/Capture-d-e-cran-2025-06-14-a-08-55-21.png
Merci d’avance.
Salut, des pistes pour tes soucis :
1 – Si tu utilises une galerie d’images (plutôt que des colonnes) ça devrait être bon sur mobile.
2 – Ton footer est dans une div qui a des marges internes (padding) de 216px à gauche et à droite, ton souci est là.
1 – pourtant j’avais essayé cette solution en premier, mais ça ne fonctionnait pas
https://i.ibb.co/3y2fQWrV/Capture-d-e-cran-2025-06-14-a-16-26-34.png
2 – j’ai mis une largeur de 216 car je veux que le footer s’aligne sur le slider
https://i.ibb.co/rGfpYQYJ/Capture-d-e-cran-2025-06-14-a-16-19-36.png
Je n’ai pas d’autres solutions ?
Bonjour
Concernant le problème du footer, je l’ai modifié un peu, mais je rencontre un problème avec une class qui est déterminée en important ! Du coup je n’arrive pas à la modifier pour la version mobile.
https://i.ibb.co/bjv2nr6Y/Capture-d-e-cran-2025-06-15-a-08-51-49.png
@media (max-width: 781px) {
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
flex-basis: 100% !important;
}
}Salut, une classe !important peut être écrasée par une autre mais c’est l’ordre de chargement des règles CSS qui fera que ça marche ou pas :
1ère règle générique pour tous les appareil
2ème règle avec media querie pour le responsif, je place toujours les règles responsives en dernier dans mes fichiers CSS.
- Vous devez être connecté pour répondre à ce sujet.