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

相关推荐
歪歪1001 分钟前
React Native开发Android&IOS流程完整指南
android·开发语言·前端·react native·ios·前端框架
知识分享小能手3 分钟前
uni-app 入门学习教程,从入门到精通,uni-app组件 —— 知识点详解与实战案例(4)
前端·javascript·学习·微信小程序·小程序·前端框架·uni-app
ZYMFZ11 分钟前
python面向对象
前端·数据库·python
长空任鸟飞_阿康15 分钟前
在 Vue 3.5 中优雅地集成 wangEditor,并定制“AI 工具”下拉菜单(总结/润色/翻译)
前端·vue.js·人工智能
lapiii35819 分钟前
快速学完React计划(第一天)
前端·react.js·前端框架
苏打水com21 分钟前
从 HTML/CSS/JS 到 React:前端进阶的平滑过渡指南
前端·javascript·html
一枚前端小能手30 分钟前
🔐 单点登录还在手动跳转?这几个SSO实现技巧让你的用户体验飞起来
前端·javascript
小潘同学33 分钟前
Vue3中响应式数据深度拷贝 Avoid app logic that relies on,,,,,,,,
前端
六六Leon36 分钟前
Kuikly跨端模式接入资源管理
前端