[didou116]

Bonjour,

Mon forum a récemment été mis à jour en 3.3.0, et j'ai profité de l'occasion pour suivre la méthode mentionnée ici afin de repartir sur de bonnes bases pour mon style prored (auparavant, mon style était plutôt du genre doublon de prosilver, avec plein de fichiers en double ). Évidemment, mon fichier prored.css fait un peu amateur, mais ça me convient et je m'y retrouve

Bref, lors de cette mise à jour, j'ai profité de l'occasion pour ajouter une image de fond à mon forum. Jusque là tout va bien. En revanche, sur la version mobile, j'ai un souci.

Lorsque je me rends sur la page de mon site depuis mon téléphone, tout va bien (a priori) :


Sauf que, en regardant de plus près, je me rends compte que je peux faire glisser ma page vers la gauche, et qu'une partie de l'image de fond apparaît alors sur la droite. Ce qui fait que ma page peut donc aussi avoir l'air de ça :


D'où ma demande d'aide

Comment puis-je régler ce problème d'affichage sur la version mobile pour que la largeur de la page s'arrête à la largeur du forum ? (faut-il adapter la taille de l'image de fond ou la supprimer complètement en dessous d'une certaine résolution ?) Dans tous les cas, comment dois-je faire ?

Adresse de mon forum : https://www.chaperlipopette.com/forum/index.php

Merci beaucoup pour votre aide

[Steph]

Salut,

Tout d'abord, j'ai modifié le titre de ton sujet, car "Problème" n'y a pas sa place, c'est trop générique et n'aide pas pour une recherche, aussi il n'était pas vraiment explicite.

Pour ce qui concerne ton sujet, je pense que cela vient de l'extension "headerbanner", mais je ne suis pas spécialiste du CSS, cependant ceci devrait fonctionner :

Ouvre le fichier ext/hifikabin/headerbanner/styles/prosilver/theme/headerbanner.css et cherche

Code: Tout sélectionner

.banner-header #hidden {
 position:absolute; 
 z-index:-100;
}

que tu remplaces par

Code: Tout sélectionner

.banner-header #hidden {
 position:absolute; 
 z-index:-100;
 width: 100%;
}

Ensuite rafraîchi le cache depuis l'onglet "Général" de l'administration et fait le test.

Bien sûr, si tu mets à jour l'extension tu perdras cette modification qu'il faudra reproduire chaque fois à moins que cela tienne compte de ce souci.

Sinon pour éviter la perte lors d'une mise à jour tu peux rajouter ceci à ton fichier CSS de ton style perso en lieu et place de ce que j'indique ci-dessus

Code: Tout sélectionner

.banner-header #hidden {
 width: 100%;
}

[didou116]

Bonjour Steph,

Tout d'abord, je confirme que le problème semble lié à l'extension. J'ai désactivé l'extension pour vérifier et effectivement, je n'avais plus de décalage et la page s'arrêtait bien à la largeur du forum.

Il faut dire que je n'avais pas encore pris le temps de préparer une bannière pour les plus petits écrans (l'extension prévoit cette possibilité). J'imagine que si je l'avais fait, cela aurait peut-être évité le problème. Je ferai peut-être des tests plus tard pour voir.

Quoi qu'il en soit, en attendant, j'ai opté pour la méthode du CSS que tu as mentionnée, et je confirme que ça fonctionne

Le problème est donc résolu

Merci!

[Steph]

Parfais !!

Ce message pour ceux qui se refuse à donner l'URL de leur forum parfois sous prétexte qu'ils sont les seuls à comprendre : Ce sujet a pu trouver une solution très simplement grâce à l'URL du forum et les outils que l'on peut utiliser à la maison pour détecter tout cela.

Refuser de communiquer l'URL de son forum c'est avoir des sujets longs comme le bras que d'autres n'auront pas envie de lire ou même qui tourneront en rond, car la solution finale se trouvera enfuie dans de nombreux messages souvent inutiles.