Probleme largeur "sorting" sur les pages catégories sur mobile

[yastof]

Bonjour à tous

Je précise que je suis débutant et y connais queudale en code 😉

J'ai pas mal avancé sur le site de ma femme, mais je bute sur un truc qui m'arrache les cheveux…
Je me suis acheté un builder (Creative Elements) et je suis assez content du résultat…
Seulement je bute sur les pages de catégories qui ne sont pas gérées par le builder.

Le menu de classement des produits est trop large lors de l'affichage sur mobile (sur tablette et ordi ok).
La page est alors plus large que l'écran et les produits se retrouvent au milieu de celui-ci et donc ne sont pas visible sans scroller latéralement.

J'utilises le thème Classiv.

Ou pourrais-je modifier ceci svp ?

Merci beaucoup

2 Copie en 1 une page fautive et en 2 en dezoomant…

 

Edited June 3, 2023 by yastof
oubli du thème utilisé (see edit history)

[lionsteph]

Bonjour,

Avec un peu de CSS (désolé c'est du code ^^) vous pouvez arranger cela.

Sans avoir accès à votre site je ne peux pas vérifier le fonctionnement mais voici un bout de code à ajouter dans le fichier assets/css/custom.css de votre thème :

@media (max-width: 767px){
    body#category #products button.select-title{max-width: 300px;}
}

 

[yastof]

Bonjour

Déjà grand merci pour ta réponse rapide… vraiment !
C'est nickel, mais ça ne suffit pas… car j'ai aussi les boutons "suivant" et retour en haut" qui sont en dehors du carde.
 

Et je m'aperçois qu'en fait c'est tout le site qui est trop large pour un écran de smartphone… et les images étant centrées dans les pages de catégories, elles sont hors champs.
Même si ça ne gène pas sur l'accueil et les pages produits, c'est moins clean que ce que je pensais…

Si t'as deux mn à m'accorder à nouveaux, j'ai mis le site en ligne en mode catalogue.
https://shop.lulucartonne.fr

Merci à toi
A bientôt

 

[lionsteph]

En fait il y a un bloc "Notifications" de creative elements qui fait 1200px de largeur et c'est lui qui chamboule tout le reste à l'affichage.

Si tu as la main sur ce bloc, il faut donc voir pour modifier cette taille :

 

Sinon faire de nouveau une correction en CSS :

@media (max-width: 767px){
  body.ce-kit-1 .container {
    max-width: 100%;
  }
}

Voila, si ça t'a aidé, hésite pas a liker mon message ou aller voir ce que je fais sur mon site. Merci.

[yastof]

Super merci !!
Ca à l'ai tellement simple 😉

J'ai pas retrouvé le bloc en question pour le moment, mais la modification du css fait je job !

Merci encore.