【兼容性】flex:1宽度溢出;flex,width 兼容低版本火狐

css 复制代码
.codeBox {
    padding: 0 20px;
    -moz-box-flex: 1; 
    flex: 1;
    width: 0;
    min-width: 0;
 }

这段代码,包含了我之前解决的两个问题。

一是:设置 flex:1,目的是想要 .codeBox 占满元素的剩余空间(这里是宽度)。但是当元素内容过宽,会挤压旁边元素。

解决方案:width:0

二是:flex:1,width:0,在低版本的Firefox浏览器不生效。

解决方案:-moz-box-flex:1; min-width:0

相关推荐
kyriewen5 分钟前
我上手了 Vite+ 1.0:Node 不用自己装,lint 却翻车了
前端·javascript·程序员
松就是我902987 分钟前
你的 PPT 不缺内容,缺一个讲它的人
前端
松就是我9029810 分钟前
别再熬夜做 PPT 了!输入一个主题,AI 帮你把整套幻灯片做好,还能随便改字
前端
吴凡wudianmei11 分钟前
每调一次模型都花钱?如何用工程手段把调用压到最少?
前端·后端·架构
李元_霸12 分钟前
基于 AI 的 Web 与 App 端到端测试实践
前端·人工智能
欣欣之王来了17 分钟前
Vue3项目脚手架:Vite vs Vue CLI怎么选?
前端·学习·架构·项目·vue3教程
用户27886072856730 分钟前
别把 tool.completed 当成业务成功:AI 工具权限审计的四层事件链
前端
陆柒14534 分钟前
跟着 Webpack 配置学习前端工程化
前端
用户63533002547940 分钟前
Day 1|HTML5:一个商城首页的骨架,从 DOCTYPE 到语义化
前端
平凡的阿泽1 小时前
我用 Trae 实现了AI辩论赛
前端