Eviter retour ligne colonne taille fixe

Bonjour,

Je travaille sur une CSS qui présente x articles en colonne verticale.
Je veux éviter le passage à la ligne suivante de ma colonne lorsque la taille de la fenêtre du navigateur est diminuée et je veux une scrollbar en bas d'écran.

Lorsque je fixe la largeur totale de mon bloc, cela fonctionne mais je ne peux pas connaître le nombre de colonne qui seront affichées.

Sur quel paramètre dois je agir ? merci

Salut,

Pas tout compris perso. T'as un ptit montage graphique, une page en ligne, un peu de code à faire tourner ?

lol

sous www.atelier-igloo.fr

coches 5 formations
cliques sur Comparer (il ya un message mais je le court-circuite pendant ton test)
puis diminues ou augmentes la largeur du navigateur
je souhaite que les 5 colonnes des formations restent sur une ligne

merci

Bonjour,

Il y aurai la solution de le mettre dans une frame mais ca serai pas joli joli

Au passage, l'image du conseiller client en haut a gauche fait un peu peur non ? pas très souriant

Re,

@Loucas : Une frame ? J'crois que t'as encore moins compris son problème que moi.

@lolodev : Ok je vois mieux, mais je comprends pas l'intérêt.

Une autre question : Si je choisis 10 formations, on a donc 5 formations sur 2 lignes au moment de la comparaison. Si on redimensionne la fenêtre tu voudrais qu'il se passe quoi ? Que l'utilisateur puisse faire défiler les 2 lignes ?

Question bonus : Si faut scroller, que ça soit verticalement ou horizontalement qu'est ce que ça change ?

La solution pour parvenir à ton résultat va ressembler à ça :
- Récupérer la largeur du viewport de l'utilisateur avec JS
- Injecter cette valeur dans l'attribut style="width:LARGEUR_VIEWPORT;" du conteneur de ta galerie (apparemment #compare-panier)
- Et dans tes CSS ajouter un overflow-x:auto

Beaucoup de blabla pour pas grand chose tu trouves pas ?
Modifié par BeliG (07 Jul 2010 - 12:05)

mais qu'il en ai 5 ou 10 , je veux un scroll horizontal, sur une ligne
et là sous CHROME par ex. lorsque je diminue la largeur de ma fenetre, les colonne passe en dessous ...
je ne veux pas

j'ai jouté overflow-x:auto, mais sans succes ....

Bonjour,

lolodev a écrit :
et là sous CHROME par ex. lorsque je diminue la largeur de ma fenetre, les colonne passe en dessous ...
je ne veux pas

Pourtant, l'utilisateur, lui, il préfèrera...

Le scroll horizontal, c'est vraiment casse pied pour l'utilisateur (la molette ayant rendu le vertical facile).

Sinon pour faire ce que tu veux faire (sic), il n'y a pas de solution en CSS, si tu ne connais pas le nombre de blocs (car il faut fixer la largeur du bloc). Si tu utilises PHP pour afficher les bloc, tu peux facilement déterminer leur nombre et ainsi générer une règles CSS en fonction de ce nombre pour fixer la largeur du bloc parent.

Mais, je le répète, c'est une TRÈS mauvaise idée.

lolodev a écrit :
j'ai jouté overflow-x:auto, mais sans succes ....

Normal, ma solution contient 3 étapes, tu es passé directement à la dernière. Mais avec le complément d'information que tu as fourni dans ton dernier message (l'affichage est toujours sur une ligne), le mieux est de le faire avec du PHP comme te l'a suggéré Laurie-Anne (au passage ça reste toujours possible avec JS).

Laurie-Anne a écrit :
Mais, je le répète, c'est une TRÈS mauvaise idée.

+1
Je ne cautionne pas non plus ce genre de mise en page. Mon intervention s'arrêtera donc ici.

je ne pense pas qu'il ya aura plus de 4 ou 5 choix
donc j'opte pour le calcul largeur css en fonction du nombre de cellule

cela fonctionne bine

merci à tout pour vos critiques positives

lolodev a écrit :
merci à tout pour vos critiques positives

Euh... Constructives, je veux bien, mais positives, absolument pas.