html scroll无效,css div设置overflow-x: scroll 横向滚动无效

我给最外层div设置了overflow-x: scroll想要里面的span超出时横向滚动 发现效果依然是上下滚动 请问这个种情况该如何布局

html

满999减40

满999减40

满999减40

满999减40

满999减40

满999减40

满999减40

css

.shopCouponBor {

width: 450px;

height: 30px;

float: right;

overflow-x: scroll;

/* overflow-x:auto;

overflow-y:hidden;*/

}

.shopCouponString {

height: 28px;

line-height: 28px;

font-size: 17px;

color: #FF9F9F;

border: 1px solid #FF9F9F;

background: #FFF1F1;

padding: 0 10px;

border-radius: 3px;

margin-right: 15px;

}