flex布局主轴元素单独设置对齐方式
来源:互联网 发布:csgo 优化 编辑:程序博客网 时间:2024/04/30 10:40
- 今天用flex布局,想在主轴上设置某个flex-item右对齐,其他的左对齐,我以为直接用align-self属性就可以了,结果没效果,后来仔细阅读文档,发现align-self属性是用在单个元素的交叉轴的设置上,主轴元素没有找到设置单个元素的属性。
- 我要的效果是这样的(主轴方向为水平方向)
- 但是实际效果所有元素左对齐
- 于是我就对最右边的元素设置以下css就成功了
.inline-field.inline-field-add{ flex-grow: 1;//这三个元素只有它在有空余空间时可伸缩,也就是它占据了所有剩余空间 display: flex;//将它设置为flex,就可以单独对他进行主轴右对齐 justify-content: flex-end;}
0 0
- flex布局主轴元素单独设置对齐方式
- 伸缩布局主轴上的对齐方式+注释
- vertical-align 属性设置元素的垂直对齐方式。
- flex Application 布局方式
- 编译对齐方式设置
- 编译对齐方式设置
- vim设置对齐方式
- Flex元素布局规则总结
- Flex中如何通过tabStyleName, tabWidth和textAlign样式,设置TabBar控件内文本对齐方式
- flex布局中对齐项目和对齐内容的区别
- FlexBox布局初识 - 主轴和侧轴
- 当元素使用flex布局,子级无法设置高度怎么办?
- DatagridView对齐方式的设置
- CCLabelTTF的设置 对齐方式
- 设置UIButton文字对齐方式
- 将Activity设置对齐方式
- UILable 设置对齐方式扩展
- html设置水平线对齐方式
- remove-duplicates-from-sorted-list-ii
- html 如何播放背景音乐
- caffe数据层
- Linux:-bash: ***: command not found
- php不为空验证 对应jqueryvalidation验证 php表单验证
- flex布局主轴元素单独设置对齐方式
- 别让沉默埋没了未来
- 关于JSONObject to Map 数字太大被转成科学计数法的问题
- 欢迎使用CSDN-markdown编辑器
- 深入学习微框架:Spring Boot
- TCP与UDP的区别
- TypeError: fnPtr is not a function
- Tomcat单向Https验证搭建,亲自实现与主流浏览器、Android/iOS移动客户端安全通信
- centos-mysql无法远程连接10038