28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Afin de régler les problèmes de compatibilté entre IE et FF, j'ai un système en php qui choisi le css à adopter en fonction du navigateur, mais malgré ça, je ne parvient pas à résoudre un problème esthétique :

J'aimerai simplement mettre en arrière plan la scrollbar sous IE, sous FF, ça ne pose pas de problème, tout marche bien, mon code est :

.contener
{
float:left;
width: 528px;
height: 539px;
top:0px;
left:332px;
background-image:url(images/contener.jpg);
position: absolute;
background-repeat: no-repeat;

}
.scroller {
height: 530px;
overflow:-moz-scrollbars-vertical;
overflow-x:hidden;
overflow-y:scroll;
z-index:-100;

Il s'agit d'une portion de code, le reste du code CSS n'a rien à voir.

Etant donné qu'il semble impossible de rendre invisible la scrollbar sous IE, je cherche un moyen de tricher.
Même si c'est pas très élégant, je prends quand même, ça pourra difficilement être pire qu'une scrollbar en plein milieu de la page.

J'attends votre aide avec impatience.
Merci.
Hello Smiley smile

azaroth a écrit :
j'ai un système en php qui choisi le css à adopter en fonction du navigateur
Tu n'as jamais entendu parlé des commentaires conditionnels ?

azaroth a écrit :
J'aimerai simplement mettre en arrière plan la scrollbar sous IE

.scroller {
height: 530px;
overflow:-moz-scrollbars-vertical;
overflow-x:hidden;
overflow-y:scroll;
z-index:-100;
Si j'ai bien compris, tu as ajouté une scrollbar à ton conteneur ".scroller" mais maintenant tu cherches un moyen de la cacher ? Smiley eek Smiley biggol

- As-tu un exemple de ce que tu aimerais obtenir au final ? (quel est l'intérêt de mettre en place une telle technique : afficher puis masquer une scrollbar ?)
- Pourquoi avoir précisé "overflow-y:scroll" alors ?
- Est-ce que le contenu doit resté scrollable même sans scrollbar (je l'espère pas, sinon bonjour l'ergonomie et l'accessibilité) ?
- Si la scrollbar te gêne pourquoi ne la caches-tu pas avec overflow:hidden ?

As-tu une page en ligne à proposer ? J'ai bien peur que ce problème de scrollbar ne soit pas la seule chose à régler...
Modifié par BeliG (16 Feb 2009 - 10:39)
Voici le site en question : http://www.net-business.fr/spa-a.com/
Pour vraiment tester, il faut cliquer sur "charte", la page étant plus longue.

Si je met Hidden, le défilement ne se fais plus.

Le contenu doit rester scrollable même sans scrollabar, ça ne pose aucun problème au client final qui a vu le résultat sans ascenseur dans Firefox.

Merci.
Ok c'est bien ce qu'il me semblait... Smiley ohwell

Je ne t'aiderais pas à faire une grosse bêtise. Virer la scrollbar d'un contenu qui en nécessite une, c'est complètement insensé.

Maintenant imagine. Je suis un visiteur de ton site et je tombe sur la page "Charte" :

- Comment je devine qu'il y a encore du contenu à lire et que je dois scroller pour l'afficher ?
- Comment je déroule la page si ma souris n'a pas de molette ? (et en supposant que je ne sache pas utiliser les touches de défilement de mon clavier).

Woow, en plus 79 erreurs à la validation et une mise en page bidouillée avec des tableaux...

Smiley mur
Bon, ben tant pis pour moi alors.
C'est vrai que ceux qui n'ont pas les moyens de se payer une souris avec molette sont légions. (12€ seulement dans les modèle de base chez Logitech)
J'ai écrit en bas du contener, qu'il faut faire défiler, enfin bon, à moins d'être très très radin ou fénéant ou très con, y'a largement moyen de naviguer sur le site.

Désolé d'être un peu direct mais bon, c'est la vérité.

Enfin, j'aurai au moins aimé savoir si c'était faisable. Auquel cas, j'irai chercher l'info ailleurs même si cette info aurait sûrement contribué à aider bon nombre de personnes plus respectueuses des radins crétins fénéants.

Merci quand même.
Excuse moi, mais le "Faire défiler" n'est absolument pas visible, et il faut vraiment le savoir pour le voir...

Ensuite, enlever la scrollbar ça incite pas à faire défiler, et là, effectivement, tu es peut être "très con", je reprends tes mots. Smiley rolleyes

Moi, je la laisse toujours, même quand la page n'en a pas besoin, ça permet de garder la même mise en page sans décalage en fonction des pages qui en ont ou pas.
Et effectivement, tout le monde n'a pas de souris avec roulette, et c'est pas forcément de son plein gré non plus...

Un webmaster digne de ce nom doit tenir compte des handicaps matériels et logiciels de ses lecteurs, handicaps de gré ou de force...
azaroth a écrit :
Enfin, j'aurai au moins aimé savoir si c'était faisable.

C'est faisable de diverses manières, notamment avec du JavaScript ou simplement en masquant visuellement la partie «barre de défilement» d'un bloc via un overflow:hidden sur un conteneur de largeur plus faible. Mais c'est une bêtise.

azaroth a écrit :
Auquel cas, j'irai chercher l'info ailleurs même si cette info aurait sûrement contribué à aider bon nombre de personnes

Oui, mais ce forum est plein d'ayatollahs qui préfèrent décourager les erreurs ergonomiques grossières, les dispositifs complètement inaccessibles, les bêtises de communication (pop-ups...), etc. Et il y a effectivement des forums, souvent plus généralistes et moins axés démarche qualité, où l'esprit est différent.

azaroth a écrit :
à moins d'être très très radin ou fénéant ou très con, y'a largement moyen de naviguer sur le site.

Ah ben tiens, juste parce que tu as oublié d'envisager des cas d'usage (c'est-à-dire le fait que certains utilisateurs ne fonctionnent pas comme toi...), les personnes concernées seraient forcément coupables de quelque chose?

On ne va pas lister ici tous les cas d'usage possibles. Il suffit de souligner ceci: la molette de défilement des souris n'est pas un mécanisme de base des interfaces homme-machine. C'est un outil supplémentaire qui s'est rajouté après des années d'utilisation de souris sans molette (à un, deux ou trois boutons). En poussant un peu, on pourrait même dire que la souris elle-même est une facilité, et pas un mécanisme indispensable aux IHM. De fait, la plupart des logiciels bien conçus (dont les navigateurs web), et n'ayant pas spécifiquement besoin d'un dispositif de pointage fin, sont entièrement accessibles au clavier. Et toutes les fonctionnalités proposées à la souris sont accessibles sans utilisation de la molette de la souris. Se reposer sur la molette de la souris (et plus largement se reposer sur l'utilisation de la souris), c'est aller contre les conventions en ergonomie des interfaces homme-machine. C'est donc prendre le risque de s'aliéner une partie des utilisateurs potentiels.

Concrètement, les trois principaux cas d'usage pour le pointage et le défilement sont les suivants:

1. Utilisation d'une souris. Dans certains cas, cette souris peut être dépourvue de molette, ou au contraire être pourvue d'une molette bi-directionnelle (ce serait assez drôle d'ailleurs de faire un site avec défilement horizontal des contenus et pas de barre de défilement visible, et de dire «les utilisateurs n'ont qu'à pas être radins et acheter une souris avec une molette bi-directionnelle»). Il faut enfin prendre en compte le fait que certains utilisateurs non experts utilisent peu les différents boutons de la souris, connaissent mal le principe du clic-droit et des menus contextuels, et n'utilisent pas ou peu la molette.

2. Utilisation du touchpad (pavé tactile). Certains sont configurés pour permettre un défilement grâce à l'utilisation de deux doigts ou de la partie tout à droite du touchpad, mais ce n'est pas systématique et ce n'est pas toujours connu des utilisateurs. Les utilisateurs de portable (ultraportable, netbook) utilisent à l'occasion des souris, mais c'est loin d'être systématique.

3. Navigation au clavier. Que ce soit par choix (utilisateurs avancés connaissant bien les raccourcis clavier) ou par obligation (utilisateur handicapé moteur ou autre ne pouvant pas utiliser efficacement une souris), une partie des utilisateurs passe par le clavier pour utiliser leur ordinateur. C'est une minorité, mais non négligeable, et dans l'idéal tout site web devrait être pleinement utilisable au clavier.