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

项目场景:

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

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


问题描述

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

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


解决方案:

bash 复制代码
子元素
display: inline-block;
white-space: nowrap;  //强制撑开并且能够自适应
相关推荐
满栀58517 分钟前
vue3动态路由详细效果
前端·javascript·vue.js·typescript·前端框架
使用小功能大师19 分钟前
从零搭建高可用Web应用:全栈架构实战与成本优化完全指南
前端·阿里云·架构·服务搭建
IT_陈寒30 分钟前
SpringBoot这个特性差点让我加班到凌晨
前端·人工智能·后端
qq_2676128933 分钟前
Gitee DevOps的度量驱动持续改进:从构建数据到交付效率的量化管理与优化路径
前端·gitee·自动化
meilindehuzi_a37 分钟前
从 Vite 到 Axios 与 Mock:React Todos 全栈项目架构及请求链路详解
前端·react.js·架构
亿元程序员39 分钟前
项目经理让我在 2D 项目里做 3D 音乐球球,我只好做了个“假的”
前端
糖果店的幽灵41 分钟前
Codex官网前端可抄吗?从模仿到创新的技术实践指南
前端·人工智能
youqingyike43 分钟前
【无标题】
前端·qt
恋猫de小郭1 小时前
Jetpack Compose 8 月版正式发布,核心模块 1.12
android·前端·flutter
纵道软件1 小时前
使用 Docker 构建自定义 SeaTunnel Web 服务镜像
前端·docker·容器