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

来源:互联网 发布:视频转gif 知乎 编辑:程序博客网 时间:2024/05/27 00:42

 

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 的类型就好了。     

 

0 0
原创粉丝点击