Learn Accessibility by Building a Quiz - Step 56

[d2kovalchuk]

Tell us what’s happening:
Hello. I don’t understand what’s wrong with my code? What’s the meaning of the mistake?

Hint

You should set the text-align: right property before the .info input rule.

Your code so far

.info input {
  width: 50%;
  text-align: left;
}

.info label {
  width: 10%;
  min-width: 55px;
}
.info label, .info input{
  display:inline-block;
  text-align:right;

}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36

Challenge: Learn Accessibility by Building a Quiz - Step 56

Link to the challenge:

freeCodeCamp.org

[bbsmooth]

It means you need to put the new rule set you created before the .info input rule set. Order sometimes matters in CSS. In this case the new rule you made and the .info input rule have the same precedence, so whichever one is listed last will override the other. Since your new rule sets text-align as well, it is overriding the text-align in .info input.

[valabojubharath]

In CSS, the last rule in the code will be applied, hence the name “cascading” style sheets.
The step intends you to style the labels and input boxes together first, then apply their individual styles next.