[Résolu] Problème de resize sur une aside

Bonjour,

J'ai un problème avec le responsive de mon site : une barre de défilement horizontale apparait sur le site en version mobile.

Je pense avoir identifié l'élément posant problème, par un overflow:hidden sur l'élément car je n'arrivais pas à le repérer :

Il s'agit apriori de ma .sidebar (vous verrez son background apparaitre en bleu foncé en mode mobile pour mieux vous permettre de la repérer). Mais je ne n'arrive absolument pas à remédier à mon problème qui persiste déjà depuis plusieurs mois...

Un petit conseil ne sera pas de trop! Merci d'avance...
Modifié par Olivier C (01 Dec 2018 - 13:48)

Bonjour,

Tu as deux choses qui posent problème pour le scroll.
Tout d'abord le span class="tempo2 cal-summer" dépasse, du coup ça ajoute une scrollbar.
Pour corriger tu dois modifier la propriété suivante :

.calendar [data-icon]{
margin:-20px -40px -20px 0;
}

ou tout simplement l'enlever pour la version mobile.

Ensuite tu as l'input de ta barre de recherche qui a un margin de 50px à droite.
Pour corriger tu dois modifier ceci :

.form-search input[type="text"]{
margin:0 50px 0 0;
}

en margin:0;

edit: pour débuguer quand ça arrive ce genre de problème il suffit avec firebug d'effacer le header, puis le footer, puis les divs contenu dans le corps principal jusqu'à ce que le scroll disparaisse. Puis on recommence jusqu'à trouver précisément quelle div pose problème.
Modifié par Raphi (08 Aug 2013 - 09:32)

Alors là merci pour tout Raphi. La margin de l'input était une valeur oubliée dans une MAJ et je ne l'avais pas vu... Désormais j'ai un framework pour WordPress sans défauts majeurs pour mes projets. Merci encore.

De rien, content d'avoir pu être utile !
Bonne soirée.