0

我正在研究一个使用SCSS. 出于某种原因，当我把它margin-top: 0;放在父元素上时，它没有生效。当我把margin-top嵌套类放在里面时，它就起作用了。有人可以解释我做错了什么吗？以下是无法按预期工作的完整代码片段：

.form__row{
 margin-top: 0;

 &__error-message{
  color: $color--negative;
 }

 &__success-message{
  color: $success-body-text;
 }

 &__attention-message{
  color: $attention-body-text;
 }

 &__info-message{
  color: $info-body-text;
 }
}

这是有效但设计不佳的代码片段：

.form__row{

 &__error-message{
  color: $color--negative;
  margin-top: 0;
 }

 &__success-message{
  color: $success-body-text;
  margin-top: 0;
 }

 &__attention-message{
  color: $attention-body-text;
  margin-top: 0;
 }

 &__info-message{
  color: $info-body-text;
  margin-top: 0;
 }
}

最后，这是呈现的 HTML：

<div class="detail-group__row ">
 <p class="form__row__success-message">
   <span class="icon-check small" aria-hidden="true"></span>

   Lorem ipsum dolor sit amet consecutir.
  </p>
</div>
4

0 回答 0