[Résolu] Problème Overflow-x & Overflow-y

Bonsoir à toutes et tous !

Voilà j'ai 1 soucis de "overflow".

J'ai une grande DIV de 3600px de large imbriquée dans une "petite" DIV de 1200px de large.

Lorsque j'utilise "overflow:hidden" sur ma petite div tout ce qui déborde au niveau de ma grande div est bien caché.

Dans mon cas j'aimerais rendre visible les débords à droite et à gauche, donc je procède de cette manière :

overflow-x: visible;
overflow-y: hidden;

Les débords de la hauteur sont bien cachés mais les débords des côtés ne sont pas visible.
À la place il y a une scrollbar horizontal au niveau de ma petite div comme si j'avais mis overflow-x: scroll;

J'ai le problème avec tous les navigateurs... quelqu'un aurait il une idée ??

Merci d'avance pour votre aide et bonne soirée !

Mickael

Bonjour,

Ce que le w3c a spécifié :
Quand un overflow-x (respectivement overflow-y) vaut "visible", si overflow-y (respectivement overflow-x) vaut "scroll" ou "auto", overflow-x (respectivement overflow-y) prend la valeur "auto".

Le w3c ne dit rien sur la combinaison "visible"+"hidden". A priori, l'idée du w3c serait qu'on ne doit pas mélanger un overflow-x (respectivement y) visible avec un overflow-y (respectivement x) pouvant afficher une scroll bar, probablement à cause des difficultés d'affichage des scroll bars que cela pourrait poser.

Ce que semble faire les navigateurs :

Quand un overflow-x (respectivement overflow-y) vaut "visible", si overflow-y (respectivement overflow-x) vaut autre chose, overflow-x (respectivement overflow-y) prend la valeur "auto".

Il semble qu'il s'agisse d'un bug de la plupart (tous?) les navigateurs ! (à prendre avec précaution, parce bon, en général, on n'a jamais raison contre la terre entière).

Amicalement,

Hello,

Overflow-x and Overflow-y Examples

Bonjour à tous !

D'abord merci pour vos interventions !

En fait j'ai réussis à régler mon problème en imbriquant la grande div (celle de 3600px) dans une div parente à laquelle j'ai attribué la hauteur de la grande div ainsi qu'un overflow:hidden. Cette div parente prend toute la largeur de la page.

L'overflow de la div de 3600px de large passe lui en visible.

Du coup je vois bien toute mes photos sans dépassement sur la hauteur.

Finalement l'effet est pas aussi mirobolant que je l’espérait (il faut avoir assez d'image pour couvrir la totalité de la largeur de l'écran sinon c'est moche...) mais le principe peut servir dans d'autres contextes.