scroll horizontal
Bonjour le monde !

je suis en plein (auto)apprentissage des techniques web (css, php...)
Pour ce faire, j'essaye de me créer un portfolio, en scroll horizontal (c'est peut-être pas le plus simple pour commencer, mais bon...)

Voilà mon problème :
je vais à terme, uploader des images de largeurs différentes, mais lorsque je les positionne "en ligne", ma <div> qui les contient ne s'adapte pas en largeur, elle s'arrête à la fenetre du navigateur... donc pas de scroll horizontal...

Comment faire ?

le chantier

la css

Première piste en utilisant firefox et firebug: A priori tu dois renseigner la propriété width du selecteur #contenu, genre width:2000px, et bien les articles ont la place pour se mettre cote a cote...

Je ne sais pas trop, faudrait l'avis des pros mais je pense que fixer la hauteur du div serait pas mal et puis ensuite allé voir du côté "overflow" (par contre je ne sais pas si cette commande est bien lu par Internet Explorer :/ )

2 sites avec scroll horizontal (ça peut aider):
cafesale.net
codelart.com

oui, mais la largeur de #contenu va varier en fonction des images présentent dedans non ?

huhu pika, dans le premier cas, c'est avec des <table> et dans le deuxieme cas c'est avec width:30000px; hum .........

sisi nanook le problème c'est de faire correspondre width avec la largeur dynamique, hors width:auto, 100% etc ne suffit pas ...

Il y a peut etre moyen d'utiliser white-space:nowrap si c'etait que du texte, ... une piste ...

o0o > XD
Beh oui j'ai pas regardé mais au moins ça à l'air de marcher dans les 2 cas ^^

Enfin fixer une largeur à 2000px je trouve que ça fait un peu codeur d'opérette. Il doit bien y avoir un moyen pour rendre le div élastique au delà de la fenêtre.

edit > +1 pour le nowarp.
Apparement si tu rajoutes:

overflow:auto;
white-space:nowrap;

ça devrait marcher (même sur ie)

le nowrap ça a son effet, pas le bon, mais on voit bien l'effet quand même.. ^^

en fait les divs contenant les textes en dessous des images se retrouvent "en ligne" aussi, peut-être devrais-je mettre tout ça en table ? mais j'ai ouïe dire que les tables, c'était poooo bieeeeeeeennnnn

up !

nan sérieux, j'suis quand même pas le premier à rencontrer ce probleme... (help)

pas de tables coco !! tu fais du css pas html ^^

Moi j'ai rencontrer le même probleme que toi au même moment et la technique de pika marche bien.
Par contre je sais pas comment t'as fait ton code css, moi j'ai une page avec un div à hauteur fixe et largeure 100% jlui ai mis les overflow et white-space et pof ça marche (dailleur merci pika ^^).
Alors je comprends pas pourquoi ça merde chez toi .. tu l'aurais pas direct mis sur le body ? :S

Plusieurs erreurs viennent brouiller ton code et peuvent être à l'origine des bugs.
D'abord change tes IDs par des class. En effet on utilise qu'une seule fois un ID par page alors que dans ton code ils sont cités plusieurs fois (boutons, article). Ensuite choisis toi un bon doctype, là c du html 4 que tu es censé faire avec le dtd que tu as choisi, un xhtml 1 transitionnal serait peut être mieux approprié pour toi.

Enfin, dans ta div conteneur, mets lui un min-width: 100%; ça devrait marcher. Surtout si tu enleves tes position absolute, ces top etc. Le overflow, pas besoin. Il va se mettre lui-même.

Et dans tes css, tu peux virer la moitié de tes propriétés ;)

min-width c'est crossbrowser?

Utilise un scrollbar personnalisable comme du temps de ghtml ^^
> > http://wiki.script.aculo.us/sc riptaculous/show/SliderDemo

***
svp, on pourrait pas avoir un bouton url dans la wiki bar, merci

***