1485 sujets

Web Mobile et responsive web design

Bonjour,
Je souhaiterais supprimer la scrollbar verticale (codée pour grand écran) et horizontale (qui apparaît qd je bascule en petit écran). Quel code css en mediaqueries ? Merci beaucoup pour votre aide. Smiley biggrin
Bonne journée ! Smiley cligne
Hello,

Tu peux le faire en js avec des plugins ou en css avec quelques astuces et le sélecteur ::-webkit-scrollbar (mais ça ne fonctionnera que sur les moteurs webkit), voici un exemple sur le site cssTricks.

Néanmoins, vouloir modifier la scrollbar (qui fait partie du navigateur et non de ton site) n'est pas forcément une bonne chose. Surtout que l'horizontale doit venir d'un bug : tu dois avoir une largeur minimale supérieure à la largeur de ton petit écran. Tu peux le corriger sans modifier l'aspect des scrollbar.

Bonne journée.
Modérateur
Salut,

@tomInCat:-1

@ploll :
;). Je te donne une piste à suivre.

@media (max-width: 700px) and (orientation: landscape) {
	#selecteurr{overflow-x:hidden;}
}

Modifié par niuxe (06 Mar 2015 - 21:22)
Bonjour,

Niuxe, je ne comprend pas ce "-1" non argumenté.

TomInCat a pourtant 100% raison : une scrollbar horizontale sur un site responsive apparaît forcément à cause d'un bug ou d'un oubli dans les media queries. Plutôt que de mettre en place un cache-misère tel que dans ta proposition, il vaut bien mieux trouver cette erreur et la corriger.
Modifié par audrasjb (06 Mar 2015 - 15:01)
Modérateur
audrasjb a écrit :

Niuxe, je ne comprend pas ce "-1" non argumenté.


tomInCat a écrit :

Tu peux le faire en js avec des plugins ou en css avec quelques astuces et le sélecteur ::-webkit-scrollbar (mais ça ne fonctionnera que sur les moteurs webkit), voici un exemple sur le site cssTricks.


Le -1 est attribué à ce paragraphe. C'est du grand n'importe quoi.

Si on le fait avec un script JS; inévitablement, on traitera le débordement qui se traite avec les attributs de styles. Il parle de plugins pour faire ça. Heu non...

document.querySelector('selecteur').style.overflowX = 'hidden';


Ensuite, il parle de CSS. Oui mais il se trompe. Puisqu'en CSS, tu as cela nativement depuis très longtemps. overflow family. Ensuite, il parle de designer la scrollbar. Bin non mauvaise solution. Je te rejoins que c'est cache misère.

@tomInCat : désolé ton intro n'est pas terrible. Tu as dit des bêtises. Je n'ai pas lu la suite malheureusement. Je t'avoue qu'aujourd'hui, je fonctionne au radar.

tomInCat a écrit :

Néanmoins, vouloir modifier la scrollbar (qui fait partie du navigateur et non de ton site) n'est pas forcément une bonne chose. Surtout que l'horizontale doit venir d'un bug : tu dois avoir une largeur minimale supérieure à la largeur de ton petit écran. Tu peux le corriger sans modifier l'aspect des scrollbar.

audrasjb a écrit :

TomInCat a pourtant 100% raison : une scrollbar horizontale sur un site responsive apparaît forcément à cause d'un bug ou d'un oubli dans les media queries.

+1

audrasjb a écrit :

Plutôt que de mettre en place un cache-misère tel que dans ta proposition, il vaut bien mieux trouver cette erreur et la corriger.


+1

Le souci, Ploll ne donne pas de bout de code sur lequel on peut s'appuyer. J'ai sortie ma boule de cristale.... C'est un peu comme le "S" d'Alsacreations, la règles 12 a encore de belles journées.
Modifié par niuxe (06 Mar 2015 - 21:21)
Bonjour à vous !
Absente qques jours de mon écran, j'ai zappé vos réponses.
Le JS,je ne sais pas faire Smiley decu
je suis encore très basic html et css Smiley smile

bon, je vais, de ce clic, essayer les pistes que vous me donnez
Mais juste pour préciser ma demande, j'ai en effet demandé un scrollbar - car hauteur de la div fixe : #contenu .texte {background: #FFF; overflow: auto;height: 500px;}
et je me demandais si je pouvais annuler cet "overflow: auto" pour les mobiles (car je me retrouve avec 2 scrollbar : celle du navigateur et... la mienne Smiley decu

Un grand merci pour vos réponses Smiley biggrin
@niuxe, tu as raison sur l'intro : je n'aurai pas dû la mettre. Surtout quand j'oriente sur un truc pas top et que je ne maitrise pas totallement Smiley confused .

Merci pour le recadrage Smiley smile