当链接显示 flex 时，链接的子元素不会覆盖文本装饰

Question

当链接 css 显示属性为 flex 时我遇到了一些麻烦：链接的子元素没有覆盖 text-decoration 属性。

示例：http://jsfiddle.net/wu627vn3/

.test{
    text-decoration:none;
    display:inline-block;
    color: red;
}

<a href="#" style="display: flex;">
    <div class="test">
        This isn't.
    </div>
    <div class="test">
        This isn't.
    </div>
</a>

Answer 1

您必须将text-decoration 添加到锚点

.test {
  display: inline-block;
  color: red;
}

a {
  text-decoration: none
}

<a href="#" style="display: flex;">
  <div class="test">
    This isn't.
  </div>
  <div class="test">
    This isn't.
  </div>
</a>