[CSS] question sur <span>

question sur <span> [CSS] - HTML/CSS - Programmation

Marsh Posté le 27-11-2003 à 15:23:14    

mon code <span> élément centré </span>ne fonctionne pas.
dans la page le texte du span est collé à celui du paragraphe
Une solution ?  
 
je voudrais que élément centré soit juste sous toto à la méme position x.
 
fichier html
 
<p class="centre"> toto</p>
<p>Texte non centré
 <span class="centre">élément centré</span>
</p>
 
fichier css
 
.centre
{
 position : absolulte;
 margin-left : 15 em;
}

Reply

Marsh Posté le 27-11-2003 à 15:23:14   

Reply

Marsh Posté le 27-11-2003 à 15:27:04    

Et euh... text-align : center; c'est pas un peu mieux que le mélange position : absolute + margin ? :??:


---------------
Everyone thinks of changing the world, but no one thinks of changing himself  |  It is the peculiar quality of a fool to perceive the faults of others and to forget his own  |  Early clumsiness is not a verdict, it’s an essential ingredient.
Reply

Marsh Posté le 27-11-2003 à 15:29:34    

oui pour cet exemple, mais en fait je voulais centrer des champs d'un formulaire. genre
nom
prenom  
age
et les inputs centrées en face de chaque élement

Reply

Marsh Posté le 27-11-2003 à 15:32:59    

En gros, tu veux que toto et élément centré soit aligné ?
Il faut se rapeller que span est un élémént inline donc il se place en absolute à 15em de la fin de l'élément qui le précéde.
 
Mais dans ce cas là que faire du texte non centré ???
 
Tu parles de l'utilisation dans le cas d'un formulaire, on peut avoir un peu plus de précision ?


Message édité par Lord II le 27-11-2003 à 15:35:49
Reply

Marsh Posté le 27-11-2003 à 15:37:17    

oui je voudrais les aligner. Une solution à part les tableaux ?

Reply

Marsh Posté le 27-11-2003 à 15:40:03    

bon je voudrais que les input fields nom et prénoms soit centrés
 
 
<p>nom:
<span class="centre"><input type="text" name="nom"></span>
</p>
<p>prénom:
<span class="centre"><input type="text" name="prenom"></span>
</p>
 
 

Reply

Marsh Posté le 27-11-2003 à 15:44:09    

centrés par rapport à quoi, et tu le vois comment dans la page, je pense que c'est comme ca :
 
nom         case
prénom     case


Message édité par Lord II le 27-11-2003 à 15:44:36
Reply

Marsh Posté le 27-11-2003 à 15:46:02    

oui c'est tout à fait cela

Reply

Marsh Posté le 27-11-2003 à 15:46:31    

mais je ne desire pas utiliser un tableau

Reply

Marsh Posté le 27-11-2003 à 15:54:27    

Je viens de tester une solution qui semble fonctionner, mais en passant par un position absolu dans le paragraphe et en utilisant la propriété left plutôt que margin-left.
De plus j'ai supprimé les span et je n'utilise plus qu'un seul paragraphe.
 

Code :
  1. <html><body>
  2. <div id="global">
  3. <p id="formulaire">
  4.  <label for="nom">Nom</label>:<input id="nom" type="text" name="nom" /><br />
  5.  <label for="prenom">Prenom</label>:<input id="prenom" type="text" name="prenom" />
  6. </p>
  7. </div>
  8. </body></html>


 

Code :
  1. #global{
  2. position:relative;
  3. width:750px;
  4. margin-left:-375px;
  5. left:50%;
  6. }
  7. #formulaire input {
  8. left:15em;
  9. position:absolute;
  10. }


 
le #global n'est là que pour vérifier que le décalage continue à fonctionner avec un niveau de bloc supplémentaire


Message édité par Lord II le 27-11-2003 à 15:56:22
Reply

Marsh Posté le 27-11-2003 à 15:54:27   

Reply

Marsh Posté le 27-11-2003 à 15:57:24    

merci de ton aide, je vais regarder cela.

Reply

Marsh Posté le 27-11-2003 à 16:15:00    

je viens de m'apprecevoir que <input> accepte l'attribut class
donc avec  
<input class="centre" type="text" name="login">
et  
.centre
{
position:absolute;
margin-left:15em;
}
 
c'est bon ça marche
 
merci de l'aide

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed