收藏
回答

占位的view完全不显示

flex布局,行方向,加了两个view设置宽度30rpx来占位,结果运行起来这两个view完全没有宽度。


至于为什么要用view来占位,是因为如果为view设置margin或者padding,这个view就会把整个页面挤出超过100%的宽度来。具体的问题见这个帖子:https://developers.weixin.qq.com/blogdetail?action=get_post_info&docid=782248acf8e9554f7bce8255e8b8f3af&token=1817990123&lang=zh_CN



这是wxml代码:

        <view class="exercise-type-container">

            <view class="exercise-type-margin"></view>

                <view class="exercise-type">

                    <image class="exercise-type-image" src="http://omj4lckbk.bkt.clouddn.com/evaluation/empty.png"></image>

                    <text class="exercise-type-text">wechat web kit is sb</text>

                </view>

                <view class="exercise-type">

                    <image class="exercise-type-image" src="http://omj4lckbk.bkt.clouddn.com/evaluation/empty.png"></image>

                    <text class="exercise-type-text">wechat web kit is sb</text>

                </view>

                <view class="exercise-type">

                    <image class="exercise-type-image" src="http://omj4lckbk.bkt.clouddn.com/evaluation/empty.png"></image>

                    <text class="exercise-type-text">wechat web kit is sb</text>

                </view>

                <view class="exercise-type">

                    <image class="exercise-type-image" src="http://omj4lckbk.bkt.clouddn.com/evaluation/empty.png"></image>

                    <text class="exercise-type-text">wechat web kit is sb</text>

                </view>

            <view class="exercise-type-margin"></view>

        </view>


这是wxss:

.exercise-type-container {

    margin-top: 50rpx;

    width: 100%;

    heigght: 100%;

    display: flex;

    flex-direction: row;

    align-items: center;

    overflow: scroll;

}

.exercise-type-margin {

    display: inline-block;

    width: 30rpx;

}

.exercise-type {

    margin-right: 20rpx;

    height: 200rpx;

}

.exercise-type-image {

    border-radius: 10rpx;

    border: 1px solid #999;

    height: 120rpx;

    width: 200rpx;

}

.exercise-type-text {

    font-size: 26rpx;

    color: #337733;

}


这是效果:



第一个子元素紧贴着左边框,完全看不到占位的view。


你们这套wxss布局框架一堆bug也敢放出来给大家用,真是服了。直接用css不行吗?


回答关注问题邀请回答
收藏
登录 后发表内容