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

项目场景:

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

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


问题描述

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

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


解决方案:

bash 复制代码
子元素
display: inline-block;
white-space: nowrap;  //强制撑开并且能够自适应
相关推荐
横冲直撞de28 分钟前
前端接收后端19位数字参数,精度丢失的问题
前端
我是哈哈hh29 分钟前
【JavaScript进阶】作用域&解构&箭头函数
开发语言·前端·javascript·html
摸鱼大侠想挣钱30 分钟前
ActiveX控件
前端
谢尔登32 分钟前
Vue 和 React 响应式的区别
前端·vue.js·react.js
神明木佑33 分钟前
HTML 新手易犯的标签属性设置错误
前端·css·html
老友@36 分钟前
OnlyOffice:前端编辑器与后端API实现高效办公
前端·后端·websocket·编辑器·onlyoffice
bin915340 分钟前
DeepSeek 助力 Vue 开发:打造丝滑的缩略图列表(Thumbnail List)
前端·javascript·vue.js·ecmascript·deepseek
鑫~阳1 小时前
Vue2是如何利用Object.defineProperty实现数据的双向绑定?
前端·vue.js·vue
寰宇软件1 小时前
PHP房屋出租出售高效预约系统小程序源码
前端·小程序·uni-app·vue·php
祈澈菇凉1 小时前
如何优化 Webpack 的构建速度?
前端·webpack·node.js