小编Con*_*olZ的帖子

在Firefox 36中存在Flexbox的问题和空间介于两者之间.由于未知空间介于两者之间的原因在Firefox中不正确(导致左边的奇怪边距),但在Google Chrome中是完美的.

Chrome屏幕截图

Firefox屏幕截图

CSS

  .form-status {
  display: flex;
  justify-content: space-between; 
  position: relative;

  &:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: $gray;
  }

  .step {
    position: relative;
    text-align: center;
    padding-top: 15px;
    color: $gray-light;

    &:after {
      content: "";
      position: absolute;
      height: 8px;
      width: 8px;
      border-radius: 50%;
      top: -11px;
      left: 50%;
      margin-left: -11px;
      background: $gray;
      border: 8px solid #0c0616;
      box-sizing: content-box;
    }

    &:first-child, &:last-child {
      &:before {
        content: ""; …