11:30 Mot de passe oublié ?

1

Je suis moins que débutant en CSS (disons que j'utilisais jusqu'ici des méthodes plus qu'heuristiques, mais là ça suffit pas).

Je voudrais aligner sur une même ligne un ensemble de div, et faire apparaître une scrollbar dans le cas où le tout est un peu large. Dans le cas où un des div contient un mot dépassant la largeur du conteneur de ces divs, tout le monde doit quand même rester sur une même ligne. Manifestement avec ce que j'ai le div large (en jaune) est placé sur une nouvelle ligne sad

http://bytecode.fr//miscfiles/yn/horiz-bar.html

2

overflow: scroll-y
et il faut que tu utilises float: (left ou right) genre :

<div style="float:left;">Gauche</div>
<div style="float:left;">Milieu</div>
<div style="float:left; overflow: scroll;">Droiteyhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh</div>
<div style="clear: left;">Nouvelle ligne</div>


J'avoue l'exemple est pourri. ^^
avatar
la Nature nous montre seulement la queue du lion. Mais je suis certain que le lion a qui elle appartient pense qu'il ne peut pas se révéler en une fois en raison de son immense taille.

- Fondateur de Ti-Gen -: http://www.tigen.org

- Membre du Groupe Orage Studio -: http://oragestudio.free.fr/

- Mon site perso -: http://tisofts.free.fr

Projets TI68K en cours:
GFA-Basic = http://www.tigen.org/gfabasic
Arkanoid.
PolySnd 3.0.

3

Mais ça va pas du tout ça smile
'Droite' est sur une nouvelle ligne là, et il me faudrait une scrollbar globale.

4

Globale, à tous les div ?
Dans ce cas :

<div style="overflow: auto;">
<div style="float: left;">Gauche</div>
<div style="float: left;">Milieu</div>
<div style="float: left;">Droite</div>
...
</div>
...


[Edit] Marche pas top. Utilise les tableaux. ^^
avatar
la Nature nous montre seulement la queue du lion. Mais je suis certain que le lion a qui elle appartient pense qu'il ne peut pas se révéler en une fois en raison de son immense taille.

- Fondateur de Ti-Gen -: http://www.tigen.org

- Membre du Groupe Orage Studio -: http://oragestudio.free.fr/

- Mon site perso -: http://tisofts.free.fr

Projets TI68K en cours:
GFA-Basic = http://www.tigen.org/gfabasic
Arkanoid.
PolySnd 3.0.

5

Malheureusement je ne peux pas.

6

Et si tu rajoutes display: inline ?
avatar
« Quand le dernier arbre sera abattu, la dernière rivière empoisonnée, le dernier poisson capturé, alors vous découvrirez que l'argent ne se mange pas. »

7

Zut, presque : ça corrige que sous IE sad

[edit] En fait ça corrige sous IE uniquement si le white-space: nowrap; est dans l'attribut style et non dans la balise style.
[edit 2] Avec white-space : nowrap; au niveau de la classe bar, et display: inline dans la classe cell, je crois que ça devrait résoudre mon problème smile http://bytecode.fr/miscfiles/yn/horiz-bar-fixed.html .
Je vérifie ça demain CSS reste toujours de la magie noire pour moi.

8

Euh et si tu remplaces tes div (les petits) par des span ?
avatar
« Le bonheur, c'est une carte de bibliothèque ! » — The gostak distims the doshes.
Membrane fondatrice de la confrérie des artistes flous.
L'univers est-il un dodécaèdre de Poincaré ?
(``·\ powaaaaaaaaa ! #love#

9

Malheureusement ce n'est pas moi qui génère les div, je n'ai pas le choix.

10

./7 > Sous Konqueror ça marche bien en tout cas.
avatar
« Quand le dernier arbre sera abattu, la dernière rivière empoisonnée, le dernier poisson capturé, alors vous découvrirez que l'argent ne se mange pas. »

11

geogeo (./4) :
[Edit] Marche pas top. Utilise les tableaux. ^^
J'espère que c'était une blague.

12

Bah non, je suis d'accord, tableaux rulez. tongue
Mais malheureusement il a déjà dit qu'il ne peut pas, il ne peut toucher qu'au CSS, pas au code HTML.
avatar
Mes news pour calculatrices TI: Ti-Gen
Mes projets PC pour calculatrices TI: TIGCC, CalcForge (CalcForgeLP, Emu-TIGCC)
Mes chans IRC: #tigcc et #inspired sur irc.freequest.net (UTF-8)

Liberté, Égalité, Fraternité

13

J'ai essayé les styles de ./7. Mais j'utilise un framework Ajax qui intègre à moitié des CSS externes et des styles générés à la volée (en fonction du browser en plus), et en l'occurence ça colisionne sick . J'abandonne. (où comment une surchouche à HTML montre vite ses limites).

D'ailleurs je me rends compte que Firebug est super puissant pour déboguer ça.

14

Utilise des tableaux… générés par CSS wink !
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Plop</title>


<style type="text/css">
<!--
.bar {
background: #666;
display: table-row;
}
.cell {
display: table-cell;
white-space: nowrap;
}
-->
</style>
</head>
<body>

<div class="bar">
<div class="cell" style="background-color: blue;">111</div>

<div class="cell" style="background-color: red;">222</div>

<div class="cell" style="background-color: green;">333</div>

<div class="cell" style="background-color: yellow;">longlonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglong
word</div>

<div class="cell" style="background-color: gray;">444</div>

</div>

</body> </html>
Cependant… ça marche impeccablement bien sous Firefox (2.0.0.11 en l’occurrence), mais pas sous IE7, cette »æ±œŒ€®¡€ qui n’est pas foutue capable de supporter les tableaux CSS vtff…
avatar
Je ne suis pas développeur Java : je suis artiste Java.
Ce que l’on conçoit bien s’énonce clairement, / Et le code pour l’écrire arrive aisément.
Hâtez-vous lentement ; toujours, avec méthode, / Vingt fois dans l’IDE travaillez votre code.
La perfection est atteinte, non pas lorsqu’il n’y a plus rien à ajouter, mais lorsqu’il n’y a plus rien à retirer.
You don't use science to show that you're right, you use science to become right.

15

Mmm, c'est exactement ce que j'aurais voulu.
Aide Charte Contacts Crédits Réalisé avec yAronet 56 ms