拖拽知识点遗漏

定位时无视盒子的padding，绝对定位的原点是在padding的左上角

---

<div className="range">//最外大盒子
          <div className="bar"></div> //灰的
          <div className="scaleline"> 
                  {this.showis()}  //刻度
          </div>    
</div>

.range{
    //width的值和.bar的是一样的，但是硬被padding多挤出来宽2*@pd的宽
     border:1px solid black;
     padding: @pd;
     position:relative;

    .bar{
    //width值父亲给传
        height: 15px;
        background-color:#ccc;
    }
    .scaleline{
    //这个width直接填满父亲，无视paading。但是width:100%却包含padding了
    //因为要填满父亲，所以最外的range也必须要有宽
        width: 100%;
        height: 10px;
        background-color: orange;
        position: absolute;
        bottom: 0;
        left: 0;
    }
}

想要底下的刻度与滑杆对齐怎么办。在i的外层盒子设置居中。这样不用再设置i的位置了。但是一定要加border-box。
这个width百分百，其实width就是width+padding。

        .scaleline{
                padding: 0 @pd;
                box-sizing: border-box;
        }

---