小程序
小游戏
企业微信
微信支付
扫描小程序码分享
- 需求的场景描述（希望解决的问题）
如何实现在一行里，一个view放在中间显示，另一个view右对齐显示
尝试过设置这一行contain 的style为flex row，justify-content：center，然后 右对齐的view 的style 为justify-self：flex-end
不知道为什么没有成功
- 希望提供的能力
3 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
<view class='warpper'>
<view class="view1 item">
</view>
<view class="view2 item">
.warpper .item {
display: inline-block;
width: 100rpx;
height: 100rpx;
background: #ccc;
}
.warpper {
position: relative;
text-align: center;
.warpper .view2 {
position: absolute;
top: 0;
right: 0;
不知道是不是你所需要的
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
感谢， relative+absolute是正解
<view class='container'>
<view class='view1'>
<view>中间的view</view>
<view class='view2'>
<view>右边的view</view>
父元素container,position:relative
子元素view1、view2 position:absolute
中间的view相对于view1居中，右边的view相对于view2右对齐
好人 relative+absolute是正解
绝对定位
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
<view class='warpper'>
<view class="view1 item">
</view>
<view class="view2 item">
</view>
</view>
.warpper .item {
display: inline-block;
width: 100rpx;
height: 100rpx;
background: #ccc;
}
.warpper {
position: relative;
text-align: center;
}
.warpper .view2 {
position: absolute;
top: 0;
right: 0;
}
不知道是不是你所需要的
感谢， relative+absolute是正解
<view class='container'>
<view class='view1'>
<view>中间的view</view>
</view>
<view class='view2'>
<view>右边的view</view>
</view>
</view>
父元素container,position:relative
子元素view1、view2 position:absolute
中间的view相对于view1居中，右边的view相对于view2右对齐
好人 relative+absolute是正解
绝对定位