Comment mettre en forme le groupe arrière-plan de couleur

Je veux mettre de la couleur du fond sur la forme-groupe. Afin de clarifier exactement ce que je veux dire, regardez l'image ci-dessous
Comment mettre en forme le groupe arrière-plan de couleur
Comme vous pouvez le voir ci-dessus que j'ai marqué le div avec la couleur, je veux mettre de la couleur d'arrière-plan de la forme-groupe.

J'ai essayé avec le code css suivant.

.signup-ctrl {

  //margin-top: 60px;

  .form-buffer {
    margin: 30px 0px;
    background-color: #006dcc;

  }
}

et le html

  <div class="col-md-5 portfolio-item">
    <form>
      <div class="form-group form-buffer">
        <input type="text" class="form-control" name="name" placeholder="Enter your name">
      </div>
      <div class="form-group form-buffer">
        <input type="email" class="form-control" name="email" placeholder="Enter your email">
      </div>
      <div class="form-group form-buffer">
        <input type="email" class="form-control" name="emailconfirm" placeholder="Enter email confirmation">
      </div>
      <div class="form-group form-buffer">
        <input type="password" class="form-control" name="password" placeholder="Enter your Password">
      </div>
      <div class="form-group form-buffer">
        <input type="text" class="form-control" name="captcha" placeholder="Enter numbers from image">
      </div>


      <button type="submit" class="btn btn-primary">Sign Up</button>
    </form>

  </div>

Mais il ne fonctionne pas, que dois-je tort?

InformationsquelleAutor zero_coding | 2015-02-08
  1. 2

    Votre .form-group prend exactement la même hauteur que le input à l'intérieur de sorte que chaque couleur d'arrière-plan vous ajoutez à cela est en fait caché derrière l'entrée.

    Vous pouvez remplacer le haut/bas des marges avec rembourrage pour faire de la .form-group zone fait plus grande que la input:

    .form-group {
  padding: 30px 0;
  background-color: #006dcc;
}
    InformationsquelleAutor kremalicious
  2. 0

    Votre CSS est incorrecte, il doit être:

    .portfolio-item form .form-buffer.form-group {
margin: 30px 0px;
background-color: #006dcc;
}

    cela permet de sélectionner l'ensemble de la .form-group. Votre erreur a été de nidification d'une règle CSS à l'intérieur d'une autre.

    Voici un violon de

    • Il ne fonctionne pas. De plus, j'ai utiliser le bootstrap thème yeti, c'est la raison, pourquoi ne pas travailler?
    • peut-être que votre CSS doit être plus précis. J'ai édité ma réponse.
    • attendez-vous dire que vous voulez la couleur de fond dans la zone de saisie?
    • Je veux changer le bankground couleur de div class="form-group.
    • avez-vous essayé de faire de mon jour de réponse?
    • oui je l'ai fait et ça ne fonctionne toujours pas. Mais la marge fonctionne comme un charme.
    • ensuite, il doit y avoir une plus profonde CSS spécificité qui n'est pas évident à travers l'exemple de code... j'ai mis à jour ma réponse encore une fois, essayez exact de l'extrait de code. Assurez-vous que le CSS dans ma réponse n'est pas à l'intérieur d'une autre règle de CSS que vous avez dans votre réponse.
    • désolé, ça ne fonctionne pas. J'ai copié exactement le code ci-dessus.

    InformationsquelleAutor alexwc_
  3. 0

    Sons étranges..!! mais il ne marche pas comme ça que vous avez appliquer padding-bottom: XXpx à l'intérieur de la form-group de votre choix au lieu de l'appliquer juste background-color, et puis il travaille pour la durée que vous avez appliqué dans le padding-bottom.

    InformationsquelleAutor startprogramming