css - css定义中为什么icon不能显示内容

Question

在我的元素中，我想使用一个图标，这里是html代码:

 <span class="item-title-icon"></span>

这里是图标的定义:

.item-title-icon
  position: relative
  left: .06rem
  top: .06rem
  display: inline-block
  width: .36rem
  height: .36rem
  background-size: .4rem 3rem
  background: url(http://s.qunarzz.com/piao/image/touch/sight/detail.png) 0 -.45rem no-repeat
  margin-right: .1rem

运气不好，显示错了，图标不能正确显示，只显示了一部分。看起来没什么问题，谁能帮帮我？

Answer 1

您的宽度似乎太小，无法完全显示图像。

width: .36rem
height: .36rem

https://jsfiddle.net/votrq7hn/