Mathieu Mourareau
Mathieu Mourareau

Reputation: 1220

style inside dl selector enable to style the next selector

i can style my dl element with the background, but not my form-row element. what i'm doing wrong ? i'm working on scss file

here the html :

.zend_form {

   background : grey
}

.zend_form > .form-row {
    background: yellow
    border: 3px solid #D2CFC7;
    box-sizing: border-box;
    padding-top: 58px;
    padding-left: 85px;
    padding-right: 85px;
    padding-bottom: 76px;
    margin-bottom: 120px;
}
<div id="form_signup">
    <form enctype="application/x-www-form-urlencoded" action="" method="post">
    <dl class="zend_form">

	    <div class="from-row">
	      <div class="from-group form_ligne" id="form_ligne_login">
	      		<span id="login-label"><label for="login" class="form_label optional">Identifiant (adresse mail)</label></span>
	      		<input type="text" name="login" id="login" value="" onpaste="return false">
	      </div>
	    </div>
	</dl>
  </form>
</div>

Upvotes: 0

Views: 46

Answers (1)

aloisdg
aloisdg

Reputation: 23531

You made a typo in the name of the class. Replace .from-row with form-row.

.zend_form > .form-row {
    border: 1px solid #D2CFC7;
    box-sizing: border-box;
    padding-top: 58px;
    padding-left: 85px;
    padding-right: 85px;
    padding-bottom: 76px;
    margin-bottom: 120px;
}
<div id="form_signup">
    <form enctype="application/x-www-form-urlencoded" action="" method="post">
    <dl class="zend_form">

	    <div class="form-row">
	      <div class="from-group form_ligne" id="form_ligne_login">
	      		<span id="login-label"><label for="login" class="form_label optional">Identifiant (adresse mail)</label></span>
	      		<input type="text" name="login" id="login" value="" onpaste="return false">
	      </div>
	    </div>
	</dl>   
  </form>
</div>

By the way, later you are using from-group. Maybe you have a typo here too.

Upvotes: 3

Related Questions