Discussion :

[pierrot10]

Bonjour,
Ce que je veux n'est pas aussi simple que l'est mon titre. je veux en effet positionner un div a coté de l'autre mais sans passer par

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
#div1{
position:abolute;
left:0px;
width:50px;
}
#div2{
position:abolute;
left:50px;
width:50px;
}
 
 
etc...

Mon code est représenté comme ceci:

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<div id="global">
  <div id="premier">premier</div>
<div id="deuxieme">deuxieme</div>
</div>

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
#global{
width:500px;
height:700px;
}
#global #premier{
position:absolute;
bottom:0px;
left:0px;
/* la largeur de mon div est difini par le nom de caractere que contient ce DIV */

}
#global #deuxieme{
position:absolute;
bottom:0px;
width:100px;
left: ?;
/* J'aimerai que left: ? soit égal a la largeur du DIV qui le précède (a gauche)*/
}

En fait, j'aimerais que le deuxime DIV soit toujours "coller" au premier DIV, quelque soit sa largeur, qui est défini par le nombre de caractere que contient le DIV premier.

Si j'entre un mot plus grand,la largeur du premier DIV, s'agrandi et le deuxieme DIV est "pousser" a droite d'un distance égal aux caractpres ajouter dans le premier DIV.

Voila, chais pas si je me suis fait comprendre.

Chais pas si on peut faire un truc du genre:

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
#global #premier{
position:absolute;
bottom:0px;
left:0px;
 
}
#global #deuxieme{
position:absolute;
bottom:0px;
width:100px;
left: 0px+ #global #premier width;
}

[MasterOfChakhaL]

Salut,

as-tu essayé:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
#premier, #deuxieme {
  float: left;
}

PS: ton premier code css est bourré de coquilles, il manque beaucoup de ; par exemple.

je te conseille de mettre ce lien dans tes favoris: Validateur CSS

[pierrot10]

merci, oui, mais ca change rien.
Desolé pour les coquilles, mon code est correct, c'est juste que je n'ai pas fait un copy/past, j'ai retaper le code

[pierrot10]

j'ai resolu mon probleme en mettant un text-align:left, pour le DIV qui contient les autres (global) et tous les autres DIVs on la propriété position:relative.

Ca marche bien. merci

[MasterOfChakhaL]

Je pense que ta solution ne marche que pour IE, après c'est p'tet pas un critère pour toi

[pierrot10]

Salut,
Tu fais bien de me le rappeler car j'avais encore rien tester sous IE. Heureusement pour moi car l'affichage est OK, sous IE. merci