项目中经常会有短竖线分隔多个元素的设计，下面记录一下实际开发中用的比较多的一种

<div class="test">hello</div>

.test
	width 100px
	height 50px
	background #eee
	position: relative;
.test:after
	content: ''
	height: 20px
	border-right: 2px solid red
	position: absolute;
	right: 0;
	top: 13px;
	
实际项目中的用法(去掉最后一个为元素的竖线以及margin值):
.st-item{
      width: 4.25rem;
      height: 1.4rem;
      font-weight: 400;
      font-size: 0.875rem;
      line-height: 1.4rem;
      position: relative;
      margin-right: 1.25rem;
      &:after{
        content: '';
        height: 1.25rem;
        border-right: 0.0625rem solid #000;
        position: absolute;
        right: 0;
        top: 0.0625rem;
      }
      &:last-child{
        margin-right: 0;
      }
      &:last-child:after{
        display: none;
      }
    }