怎样使绝对定位的元素宽度自适应子元素

项目场景:

在一个大屏展示页面中,使用了全局绝对定位,元素相对于父元素(全局)进行绝对定位,元素气泡描述再次使用了绝对定位,气泡相对于元素进行绝对定位。

气泡描述有两行数字描述,需要自适应宽度。


问题描述

但是由于使用了绝对定位,子元素无法自适应,只能给定宽度撑开父元素。

给定宽度的话,数字短了,背景图就过长,数字长了,就会自动换行,影响美观。


解决方案:

bash 复制代码
子元素
display: inline-block;
white-space: nowrap;  //强制撑开并且能够自适应
相关推荐
冰暮流星7 分钟前
javascript之this关键字
开发语言·前端·javascript
余大大.10 分钟前
SystemVerilog-参数宏与拼接符的使用
前端
羸弱的穷酸书生13 分钟前
跟AI学一手之前端导出
前端·文件导出
怕浪猫13 分钟前
Electron 开发实战(十三):性能优化策略|极速启动、低内存、流畅渲染、极致瘦身
前端·javascript·electron
Csvn17 分钟前
React useEffect 异步竞态:90% 的人都踩过的坑
前端·react.js
如果超人不会飞19 分钟前
用TinyRobot Bubble组件打造灵活强大的AI对话气泡
前端·vue.js
橘子星19 分钟前
打破串行枷锁:深入理解 JS 同步、异步与 Promise 实战
前端·javascript
用户0595401744619 分钟前
LangChain 记忆模块踩坑实录:靠自动化测试,我把上下文丢失率从 30% 降到 0
前端·css
kismet78719 分钟前
fetch 正常,页面却 404?Nuxt 3 + CDN 跨域下的 preload CORS 陷阱
前端·产品