微信小程序等分换行之怪异盒模型

border-box 告诉浏览器去理解你设置的边框和内边距的值是包含在width内的。也就是说，如果你将一个元素的width设为100px,那么这100px会包含其它的border和padding，内容区的实际宽度会是width减去border + padding的计算值。大多数情况下这使得我们更容易的去设定一个元素的宽高。

border-box width 和 height 属性包括内容，内边距和边框，但不包括外边距。这是当文档处于 Quirks模式 时Internet Explorer使用的盒模型。注意，填充和边框将在盒子内 , 例如, .box {width: 350px; border: 10px solid black;} 导致在浏览器中呈现的宽度为350px的盒子。内容框不能为负，并且被分配到0，使得不可能使用border-box使元素消失。
这里的维度计算为： width = border + padding + 内容的 width， height = border + padding + 内容的 height。

<view class="recommendlist">
	<image class="recommendShoppings" mode="widthFix" wx:for="{
    
    {recommendList.PRODUCT}}" wx:key="index"  src="{
    
    {item.THUMB_URL}}"></image>
</view>

.recommendlist{
    
    
  padding:5px 4px 50px 4px;
  background-color: white;
  margin-top: 12px;
}
.recommendlist .recommendShoppings{
    
    
  width: 50%;
  box-sizing: border-box;
  padding: 2px;
  margin-bottom: 10px;
}