Espacement relatif à une marge

Version imprimable

29/05/2007, 17h26
jean-pierre96

Espacement relatif à une marge

Bonjour,

comment faire pour réaliser un espacement par rapport à la marge gauche de la page, et non par rapport à l'élément parent à gauche?

merci pour votre aide
29/05/2007, 17h26
Deallyra

margin-left ne marche pas?
29/05/2007, 17h46
jean-pierre96
Si mais l'espacement se fait par rapport à l'élément avant.

En fait par exemple:
Code:

1 2 3 4 Nom: Toto Prénom: Dudu Fonction: Tata
faudrais que j'aligne comme ceci:
Code:

1 2 3 4 Nom: Toto Prénom: Dudu Fonction: Tata
29/05/2007, 17h50
Deallyra

c'est pour un formulaire?
ou c'est juste un exemple?
29/05/2007, 18h05
jean-pierre96

C'est pour un formulaire en effet. Mais il y aura du texte simple aussi à aligner en fait
29/05/2007, 21h03
LeXo

avec en css la propriété float

sinon avec une position absolute
29/05/2007, 22h55
jean-pierre96

Auriez vous un exmple? :oops:

Exemple de formulaire :

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
p.formcontact{
   clear:both;
   margin-bottom:2px;
   height:20px;
   line-height:20px;
}
p.formcontact label{
   display:block;
   float:left;
   width:100px;
   text-align:left;
}
p.formcontact input, p.formcontact textarea{
   display:block;
   float:left;
   color:#123456;
   border :1px solid #abc;
   padding:1px;
   font:normal 11px arial,sans-serif;
}
p.formcontact input{
   width:200px;
}
p.formcontact textarea{
   width:400px;
   height:200px;
   overflow:auto;
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<p class="formcontact">
   <label for="nom">Nom :</label>
   <input id="nom" type="text" />
</p>
<p class="formcontact">
   <label for="mail">E-mail :</label>
   <input id="mail" type="text" />
</p>
<p class="formcontact">
   <label for="sujet">Sujet :</label>
   <input id="sujet" type="text" />
</p>
<p class="formcontact">
   <label for="message">Message :</label>
   <textarea id="message"></textarea>
</p>

30/05/2007, 09h51
Deallyra
tu peux utiliser la balise html <label> et le css
label
{
display : block;
width : 130px;
}
Code:

1 2 3 4 5 6 <label for = "Societe"> _ Société : </label> <input name = "Societe" type = "text" id = "Societe" size = "20" /> <br />
EDIT : oups désolée Bisûnûrs.... j'avais pas lu toute ta réponse...:oops:
30/05/2007, 12h45
LeXo

un tres bon tuto pour les formulaires

Formulaire & CSS
30/05/2007, 17h51
jean-pierre96

Je vous remercie tous énormément
:)
Bye
31/05/2007, 20h52
jean-pierre96
En fait je viens de détecter un problème sous firefox que je n'arrive pas à résoudre. J'utilise le code de Bisûnûrs. Et quand j'ai le code:
Code:

1 2 3 <p class="formcontact"><label for="message">Message :</label> <textarea id="message"></textarea></p> <h3>Autres</h3>
Sous IE le textarea s'affiche bien aligné, et le titre "Autres" s'affiche en dessous à la ligne. Par contre sous firefox, ben le titre "Autres" il reste coincé sur la gauche du textarea.

Comment résoudre ce problème?

Merci de m'aider :oops:
01/06/2007, 20h18
jean-pierre96

Vraiment aucune idée? :oops: