【兼容性】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

相关推荐
cxxcode4 分钟前
Vite 热更新(HMR)原理详解
前端
HelloReader15 分钟前
Tauri 架构从“WebView + Rust”到完整工具链与生态
前端
UIUV25 分钟前
node:child_process spawn 模块学习笔记
javascript·后端·node.js
Bigger27 分钟前
告别版本焦虑:如何为 Hugo 项目定制专属构建环境
前端·架构·go
烛阴1 小时前
Three.js 零基础入门:手把手打造交互式 3D 几何体展示系统
javascript·webgl·three.js
颜酱2 小时前
单调栈:从模板到实战
javascript·后端·算法
代码匠心2 小时前
AI 自动编程:一句话设计高颜值博客
前端·ai·ai编程·claude
_AaronWong3 小时前
Electron 实现仿豆包划词取词功能:从 AI 生成到落地踩坑记
前端·javascript·vue.js
cxxcode3 小时前
I/O 多路复用:从浏览器到 Linux 内核
前端
用户5433081441944 小时前
AI 时代,前端逆向的门槛已经低到离谱 — 以 Upwork 为例
前端