Un Alignement un peu complexe

Version imprimable

27/04/2006, 14h46
Jeskor

Un Alignement un peu complexe

Bonjour a tous !!

voilà mon problème :

J'ai 2 zones définies par des classes css

________________
| texte|<-element |
| texte|<-element |
| texte|<-element |
| texte|<-element |
-------------------

Dans la zone de gauche j'ai du texte, et dans celle de droite des elements ( select, checkbox et autres ...)

Mais le texte de gauche est directement lié a son élément a droite ...

J'ai donc décidé d'espacer le texte avec line-height pour le mettre en face ... Mais cela ne fonctionne pas dans la zone de droite car il n'y a pas de texte ... du coup je n'arrive pas a aligner le texte et mes elements de la boite de gauche te de droite ....
27/04/2006, 14h56
Poutchou

pourquoi tu fais pas ça tout simplement avec des tableaux et des cellules ?
27/04/2006, 15h20
ilood

Citation:

Envoyé par Poutchou

pourquoi tu fais pas ça tout simplement avec des tableaux et des cellules ?

Teuteuteu, surtout pas :fessee: ;)

Jeskor, as-tu essayé avec des label devant chaque élèment ?

Code:

<label for="nom">Nom : </label> <input type="text" id="nom">

Sinon post le bout de code qui pose problème (html et css)
27/04/2006, 15h22
Poutchou

c'est bien pratique les tableaux. je vois pas ce qui vous gêne là dedans.

bon j'ai progresse depuis :)

maintenant tout est bien aligné :) reste un problème

mon text area n'est pas aligné avec mes elements .... il est décalé sur la droite ...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
div.row 
{
 position:relative;
 top: 0px;
 left: 0px;
}
 div.row span.label 
 {
  float: left;
  width: 180px;
  text-align: right;
}
div.row span.formw 
{
 float: left;
  text-align: left;
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<div class="row">
  <span class="label">(info 1) : </span>
  <span class="formw"><select name="f1_info1" onChange="traitementliste2()"></select> </span>
 </div>
 <br><br>
 <div class="row">
  <span class="label">(info 2): </span>
  <span class="formw"><select name="f1_info2" onChange="traitementliste3()"></select> </span>
 </div>
  <br><br>
 <div class="row">
  <span class="label">(info 3): </span>
  <span class="formw"><select name="f1_info3"></select> </span>
 </div>
  <br><br>
 <div class="row">
  <span class="label">Info 4: </span>
  <span class="formw"><input type="textarea" name="f1_info4" size="8" maxlength="8" ONBLUR=javascript:verificationtype(document.f1_creation.f1_info4.value)></span>
 </div>
  <br><br>
 <div class="row">
  <span class="label">Info 5: </span>
  <span class="formw">
   <input type="CHECKBOX" name="f1_info5" value="case1">Case 1
   <input type="CHECKBOX" name="f1_info5" value="case2" CHECKED>Case 2
   <input type="CHECKBOX" name="f1_info5" value="case3">Case 3
  </span>
 </div>

27/04/2006, 16h26
franculo_caoulene

:roll: http://www.developpez.net/forums/showthread.php?t=90996
27/04/2006, 17h04
Jeskor

aucune importance .... Problème réglé