Css 垂直堆叠多个旋转元素

在使用“旋转”时，如何垂直堆叠多个元素，而不必静态固定元素之间的间距（在我的示例中，使用从底部开始的像素宽度）

以下是我当前的HTML和CSS/SASS：

HTML:

下面是我的垂直堆叠元素当前的屏幕截图

这里有一个

请让我知道你的想法

.results-indicator-container {
    height: 59px;
    left: 167px;
    width: 16px;
    font-size: 12px;
    float: left;
}
.results-indicator-label {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    float:left;
    clear:left;
    height:20px;
    width:20px;
    border-bottom: 1px solid #CCC;
}
.won{

}
.lost{

}
.tied{

}

<div class="results-indicator-container">
    <div class="results-indicator-label won">5x</div>
    <div class="results-indicator-label lost">5x</div>
    <div class="results-indicator-label tied">5x</div>
</div>

。结果指示器容器{
高度：59px；
左：167px；
宽度：16px；
字体大小：12px；
浮动：左；
}
.成果指标标签{
-webkit变换：旋转（-90度）；
-moz变换：旋转（-90度）；
过滤器：progid:DXImageTransform.Microsoft.BasicImage（旋转=3）；
浮动：左；
清除：左；
高度：20px；
宽度：20px；
边框底部：1px实心#CCC；
}
韩元{
}
.迷路了{
}
.平局{
}
5倍
5倍
5倍

.results-indicator-container {
  bottom: 51px;
  height: 59px;
  left: 167px;
  position: relative;
  width: 16px;
  font-size: 12px;
  float: left;

  .results-indicator-label {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    position: absolute;
    bottom: 0px;
  }

  .results-indicator-label-won {
    @extend .results-indicator-label;
  }

  .results-indicator-label-lost {
    @extend .results-indicator-label;
    bottom: 25px;
  }

  .results-indicator-label-tied {
    @extend .results-indicator-label;
    bottom: 50px;
  }
}

.results-indicator-container {
    height: 59px;
    left: 167px;
    width: 16px;
    font-size: 12px;
    float: left;
}
.results-indicator-label {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    float:left;
    clear:left;
    height:20px;
    width:20px;
    border-bottom: 1px solid #CCC;
}
.won{

}
.lost{

}
.tied{

}

<div class="results-indicator-container">
    <div class="results-indicator-label won">5x</div>
    <div class="results-indicator-label lost">5x</div>
    <div class="results-indicator-label tied">5x</div>
</div>