positionnement CSS

Markos
Les bases HTML/CSS

Bonjour,
J'ai lu dans de nombreux articles que la propriété "display:inline" positionne les blocs côte à côte. Ce n'est pas tout à fait vrai. A vrai dire, je ne comprends toujours pas ce que cette propriété signifie.
Soit le formulaire HTML suivant : 

<form action="" method="post">
    <div class="form-group">
        <label for="nom"></label>
        <br></br>
        <input id="nom" type="text" value="" name="nom"></input>
    </div>
    <br></br>
    <div class="error-message"></div>
    <div class="form-group">
        <label for="email"></label>
        <br></br>
        <input id="email" type="email" value="" name="email"></input>
    </div>
    <br></br>
    <div class="error-message"></div>
    <div class="form-group"></div>
    <br></br>
    <div class="error-message"></div>
    <p></p>
</form>

Si j'attribue la propriété display:inline aux balises label et input, elles se positionnent bien les unes sous les autres.
Comment faire si je souhaite faire apparaître les labels à gauche des inputs correspondants, chacun sur la même ligne ?
J'ai essayé beaucoup de combinaisons, beaucoup de propriétés float, display, position, de toutes sortes, sans pouvoir jamais parvenir à ce résultat.
Aidez-moi !

5 réponses

wilose
Réponse acceptée

Il faut simplement enlever les passages à la ligne (br):

<style>
    label, input{
        display:inline;
    }
</style>
<form action="" method="post">
    <div class="form-group">
        <label for="nom"></label>
        <input id="nom" type="text" value="" name="nom"></input>
    </div>
    <br></br>
    <div class="error-message"></div>
        <div class="form-group">
        <label for="email"></label>
        <input id="email" type="email" value="" name="email"></input>
    </div>
    <br></br>
    <div class="error-message"></div>
    <div class="form-group"></div>
    <br></br>
    <div class="error-message"></div>
    <p></p>

</form>
Markos
Auteur

Quel idiot je suis ! Je viens de m'en rendre compte !... J'ai un peu (beaucoup) honte !... J'ai posté la même question sur un autre forum, et un internaute a été - tout en restant tout à fait correct - un peu moins "diplomate" que toi, mais je l'ai entièrement mérité ! Je me suis encore rendu ridicule !

...Voilà, Voilà... ça, c'est fait...
(Oh la honte !)

Lotfi Berrahal

L'erreur est humaine Markos et on apprend toujours de nos erreurs donc t'en fais pas et les personnes qui ne sont pas compréhensives peuvent aussi se passer de commentaire ;)

Pewel-OutOfNutella

Les personnes qui t'envoie ballader quand tu poste gentillement une demande d'aide en étant courtois, il faut que tu les envoie ballader aussi.

Si tu demandes comme une mer**, là ok on peut comprendre que ceux qui répondent ne soient pas très diplomates.
Mais à la base, les forums de ce type sont là pour entraider, du coup ceux qui ne sont pas diplomates devraient passer leur chemin :)

Markos
Auteur

C'est rien : il m'a juste dit :

"Salut,

sais-tu à quoi sert la balise <br> ?"

Y'a pas de quoi se vexer. D'autant, comme je l'ai dit, que je l'ai bien mérité, pour mon étourderie.