Flexbox网格/标签没有包装

时间:2015-09-13 13:53:56

标签: css flexbox

有没有办法在这个flexbox网格/标签中执行这些元素而不将它们放在包装器中?

http://jsfiddle.net/mu98yotk/

.test {
    border: 1px solid #ccc;
}

.test, .test .wrapper {
    display: flex;
}

.test .wrapper {
    flex: 1;
}

.test .wrapper * {
    margin: 0 auto;
    padding: 0 15px;
}
<div class="test">
    <div class="wrapper">
      <p>Lorem</p>
    </div>
    <div class="wrapper">
      <a href="#">Ipsum</a>
    </div>
</div>

1 个答案:

答案 0 :(得分:2)

.test {
  border: 1px solid #ccc;
  display: flex;
}
.test > * {
  margin: 0 auto;
  padding: 0 15px;
}
.test > p {
  border-bottom: 2px solid blue;
}
<div class="test">
  <p>Lorem</p>
  <a href="#">Ipsum</a>
</div>