css的columns属性在实际开发过程中的应用

平时的表单需求都是从上到下,表单多了就出滚动条。最近有个产品给出一个表单多了就分两列的需求。

需求描述

现有的表单组件展示样式

预期的表单组件展示

antd的表单实现

直接在form上增加 columns: 2

非antd实现不起作用原因

我在自己实现的表单form上使用了display: flex

解决方案

将顶级标签设置为display: block或者display: inline-block或者display: flow(实验性属性)或者display: table-cell或者display: table-caption 或者 display: list-item

相关推荐
风雨兼程^_^11 分钟前
Nuxt3项目的SEO优化(robots.txt,页面tdk,伪静态.html,sitemap.xml动态生成等)
前端·seo·nuxt3·服务端渲染ssr
佬乔13 分钟前
xml中配置AOP织入
java·服务器·前端
Eugene__Chen15 分钟前
JavaWeb开发基础知识-XML和JSON
java·开发语言·前端
谢尔登18 分钟前
为 IDEA 设置管理员权限
前端·express
Kx…………33 分钟前
Uni-app入门到精通:uni-app的基础组件
前端·css·学习·uni-app·html
巴巴博一37 分钟前
keep-alive缓存
前端·javascript·vue.js·缓存·typescript
Tipriest_1 小时前
【前端扫盲】postman介绍及使用
前端·测试工具·postman
wuaro1 小时前
JS的深浅拷贝
前端·javascript·html
Hamm2 小时前
用一种全新的方式来实现i18n,和魔法字符串彻底说拜拜
前端·vue.js·typescript
摸鱼仙人~2 小时前
React: hook相当于函数吗?
前端·javascript·react.js