1485 sujets

Web Mobile et responsive web design

Trouver le sélecteur à l origine du scrollbar horizontal

bonjour
Existe il une technique ( snipplet / scriplet) qui permet de savoir dans le code html quels sélecteurs ( quel code css à l intérieur de ce sélecteur) est à l origine de l apparition du scrollbar horizontal ? .


Dans un sens je cherche un script que scanne toules sélecteurs et affichent pour chacun d'eux leur width par rapport au width du navigateur . .

Quel est le terme pour définir se comportement ( adaptive ou responsive .... ou ?)

upload/48731-creamyhori.jpg

pas de nom d'élément en utilisant ce lien https://css-tricks.com/findingfixing-unintended-body-overflow/[/url]

Merci
Modifié par 75lionel (07 Jun 2016 - 01:58)
ce lien semble la solution visuelle mais pas une méthode très intuitive directe !! min-width est en cause car le désactivé dans un sélecteur change la longueur de la scrollbar horizontal mais ne le fait pas disparaitre !!
http://stackoverflow.com/questions/14146356/which-element-is-causing-the-horizontal-scrollbar-automated-detection

je cherche la solution par script qui m affiche le nom du sélecteur en cause en testant diminuant de 1 px le width du navigateur ( valeur de départ) de 800px pour s 'arrêter à 200px ( dans mon cas) !!
Modifié par 75lionel (07 Jun 2016 - 09:54)
KolaCaine a écrit :
J'ai du mal à comprendre ta requête

Et oui : il est moins difficile de lire un site anglophone via Google Translate que d'essayer de comprendre ce que veulent dire les posts de Lionel...

Ce qui me fait dire, Lionel, que le français n'est pas ta langue maternelle, je me trompe ?
KolaCaine a écrit :
J'ai du mal à comprendre ta requête


en terme plus simple : comment éviter de voir lorsque l on réduis la taille ( width) du navigateur une barre de défilement horizontal apparaitre !! Existe t il un moyen pour savoir dans le code css ou se trouve le code css en cause ?


Est plus compréhensible ?

Sinon est ce que j 'ai bien compris ( passer assez de temps pour comprendre ) votre requête à propos du fullpage
Modifié par 75lionel (07 Jun 2016 - 10:01)
Modérateur
Hello,

Quand je cherche d'où vient ce genre de scrollbar, je le fais toujours avec Chrome et son super utile Insepecteur d'élément (F12) <- à part le café, on fait tout cet outil !!.

- Aller sur le site
- Clique droit sur la barre de scroll > Inspecter l'élément
- Et puis là, tu peux faire "Delete" et "ctrl + Z" sur les portions de code pour trouver l'élément qui te génère ce scroll

Le plus simple est de partir du niveau le plus bas et de supprimer les éléments 1 à 1. Dès que tu ne vois plus ta scrollbar, c'est bingo tu es sur le bon élément et donc tu passes coté CSS pour voir ce qui cloche dans les propriétés.

Edit :
Sorry, c'est déjà ce qui est montré dans la vidéo... Du coup pour, pas de script pour moi, j'utilise mes petits mains et ma petite souris...
Modifié par Yordi (13 Jun 2016 - 16:32)
C'est du reverse engineering.
Faut éditer le fichier CSS dans un éditeur de texte, et recherche le code "min-width".
je n'avais pas pensé à ces techniques même si je cherchais une façon automatisé ( script ) .
quand je parle du code css je sous entends "associé à une balise html " que je ne connais pas
@Yordi a écrit :

Le plus simple est de partir du niveau le plus bas et de supprimer les éléments 1 à 1. Dès que tu ne vois plus ta scrollbar, c'est bingo tu es sur le bon élément et donc tu passes coté CSS pour voir ce qui cloche dans les propriétés.

....
A vrai dire cela ne signifie seulement que le code html est dans la hiéarchie donc encore beaucoups de travail pour trouver la boite à l origine de l erreur . sinon j 'apprécie aussi chrome ENORMEMENT !!
Merci
Modifié par 75lionel (14 Jun 2016 - 23:10)
Sujet clos
Aller à