微信小程序 inlin-block 不对齐问题。

 

1 将 并列的 view 设置为 inline-block 后 会出现 不对齐的问题 ， 

<navigator    url=" ">

        <view     style="display:inline-block:">
          <image   src="{{item.img}}"  ></image>
        </view>
        <view style="display:inline-block:">
           <view> </view>
        </view>

      </navigator>

2 在 添加上 vertical-align:top;  后就会对其。

<navigator    url=" ">

         <view     style="display:inline-block: vertical-align:top;">
            <image   src="{{item.img}}"  ></image>
         </view>
         <view  style="display:inline-block:vertical-align:top;">
           <view> </view>
         </view>

      </navigator>

3  应该是由于display:inline-block; 是基于vertical-align:baseline 对齐的， 改变一下vertical-align 的类型就好了。