父元素被子元素撑开

最新推荐文章于 2025-04-01 17:34:17 发布
最新推荐文章于 2025-04-01 17:34:17 发布
阅读量4k 收藏
点赞数 1
CC 4.0 BY-SA版权
分类专栏： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/hh_liweihong/article/details/79958154
本文介绍了当浏览器宽度变小出现滚动条时，如何保持父元素的宽度不被子元素撑开的方法。提供了两种解决方案：使用 float:left 或 display:inline-block 属性。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >


浏览器的宽度变小，页面形成滚动条时，父元素的宽度变成当前的显示宽度，不能被子元素撑开。

想撑开的两种方法给父元素：1:float：left

                                      2:display：inline-block；

解决：父级元素不能被子元素内容撑开的解决办法，父级元素没有高度的解决办法...
weixin_33853794的博客
01-14 3153
问题 父级元素不能被子元素内容撑开的解决办法，父级元素没有高度的解决办法。 今天在写网页时遇到如下图问题，解决问题后自己做个随笔，希望帮到更多的学前端的童鞋！ 问题图片 问题描述 最外层的父级元素不能自适应高度-不能随对象撑开没有高度 当在对象内的盒子使用了float后，导致对象本身不能被撑开自适应高度，这个是由于浮动产生原因。 解决方法 一、 在父元素里最底部加上一个cle...
父元素flex:1时高度被子元素撑开的解决方法
weixin_46447553的博客
01-05 2725
父元素flex:1时高度被子元素撑开的解决方法
解决高度塌陷--父元素未被子元素撑开问题，外边距重叠问题
前端如逆水行舟...
05-19 2715
文章目录 前言 一、解决办法是什么？ 二、某些方法不推荐的原因 1.某些方法不推荐的原因 2.什么是BFC? 总结 前言 什么是高度塌陷？ 高度塌陷是指当子元素设置浮动后，导致子元素脱离文档流，无法撑起父元素的高度，下方元素自动上移，造成页面布局混乱 其中a是父元素，b是子元素（且设置浮动） 一、解决办法 办法一：父元素同样设置浮动 例如：.a{float:left} 其中a为父元素----->不推荐，原因在下一个模块解释 办法二：为父元素...
【css】flex布局父元素宽度或高度无法被子元素撑开-bug记录
qq_2511276124的博客
07-24 1777
flex布局父元素宽度或高度无法被子元素撑开问题。 解决方案： ==**手动计算子元素内容所占宽高，手动赋值给父元素即可。**==
html 内容不被父级包住,解决：父级元素不能被子元素内容撑开的解决办法，父级元素没有高度的解决办法...
weixin_39737233的博客
06-09 988
问题父级元素不能被子元素内容撑开的解决办法，父级元素没有高度的解决办法。今天在写网页时遇到如下图问题，解决问题后自己做个随笔，希望帮到更多的学前端的童鞋！问题图片问题描述最外层的不能自适应高度-不能随对象撑开没有高度当在对象内的盒子使用了后，导致对象本身不能被撑开自适应高度，这个是由于浮动产生原因。解决方法一、在父元素里最底部加上一个clear清除浮动的标签(无需内容)，并设置clear: bot...
记录一个父级div不能被子级内容撑开的解决方法，父级div没有高度的解决方法。
lihang199的博客
07-19 1万+
文章出处和来源网址：http://www.divcss5.com/jiqiao/j612.shtml 今天遇到一个可能你在项目里也会经常遇到的问题如下图，解决以后转载过来自己做个记录。 最外层的父级DIV不能自适应高度-不能随对象撑开没有高度 当在对象内的盒子使用了float后，导致对象本身不能被撑开自适应高度，这个是由于浮动产生原因。 如何解决父div对象自适应高度，方法有三种，接...
[css] flex 子元素自动撑开父元素宽度
qq_14993591的博客
11-03 4357
这样，子元素将会垂直排列在一列内，并自动撑开父元素的宽度。同样地，如果子元素的高度总和超过了父元素的高度，则子元素会被压缩，以适应父元素的高度。这样，子元素将会水平排列在一行内，并自动撑开父元素的宽度。如果子元素的宽度总和超过了父元素的宽度，则子元素会被压缩，以适应父元素的宽度。对于水平排列的情况，我们可以设置父元素的。对于垂直排列的情况，我们可以设置父元素的。
element-ui中el-tree的父元素设置好宽度后不能被子内容撑开的问题 el-tree宽度
m0_73430799的博客
06-19 310
所以下边的div内容撑不起来，而且.el-tree-node__children的overflow属性是hedden，所以下边的内容一多就自动隐藏了；原因分析： 因为.el-tree-node__content的 display默认的是。设置完父级的宽度之后，el-tree将不能被撑开，一旦子树的内容太长就显示不出来了；
IE6下position定位子元素溢出，父元素被撑开的解决思路
chusi3931的博客
04-18 296
[code="html"] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ...
子元素自动撑开父元素空间
qq_52317104的博客
10-13 2413
宽度 width !注意: 如果一个元素不添加width 属性，默认属性值为auto，不同的元素浏览器会根据其特点自动计算出实际宽度. 块级元素，其 width 属性的值会自动撑满父元素的 width 区域 注意：width用百分比比的是父元素的width，就是说若取100%，父元素无影响，尽量用px。 块级元素会独占一行，其宽度自动填满其父元素剩余宽度 行内元素，其 width属性的值是内部元素内容自动撑开的宽度。 < body >元素比较特殊，不需要设置 width 属性，宽度会自动适应浏
html，css显示父子元素的关系，被撑开，包围
weixin_45986454的博客
06-05 1048
标题:html，css显示父子元素的关系，被撑开，包围 一、显示的图形，父元素被子元素撑开了，若没有写边界，则显示的图像会看起来很怪 .box1{ width:200px; background-color:orange; border:5px red solid; } .box11{ width:100px; height:100px; backgroun
父div内有浮动的子div，父div的宽度不会被子div撑开
08-11 5756
for example： 像上面这样简单的html代码,你可能会很直接的算出,div1的宽度和高度是子div之和,但是事实却不是这样的,你会发现,div1的宽度为body的宽度,高度为0. why? 尼玛毫无人性啊,这不是父div包含了两个子div,父的宽度应该会被撑开的啊? 但是,两个子div他是float的,由于他们float了,脱离的正常的文档流,也就脱离了父div的控制,也
flex布局中item被子元素撑大的情况
hypo的博客
07-19 555
比如下面的布局，main的宽度会被撑到800px，从而在wrapper出现滚动条。如果想main占剩余空间，又不想被child把宽度撑开，可以在main上加overflow=auto属性即可。此时main会出现滚动条。
前端面试题（适合vue）
热门推荐
qq_39440052的博客
06-28 4万+
面试题集合1、v-model是什么？ vue中标签怎么绑定事件？答：v-model这个指令只能用在表单元素上，可以用他进行双向数据绑定。绑定事件：&lt;input @click=doLog() /&gt;2、mvvm框架是什么？说说对双向数据绑定的理解？它和其它框架（jquery）的区别是什么？哪些场景适合？答：mvvm的m模型就是用来定义驱动的数据、v经过数据改变后的html、vm就是连接数据...
element-ui中el-tree的父元素设置好宽度后不能被子内容撑开的问题
weixin_30545285的博客
11-20 3296
设置完父级的宽度之后，el-tree将不能被撑开，一旦子树的内容太长就显示不出来了； 原因分析： 因为.el-tree-node__content的 display默认的是flex，所以下边的div内容撑不起来，而且.el-tree-node__children的overflow属性是hedden，所以下边的内容一多就自动隐藏了； 解决方法： .el-tree{ ...
css 样式问题:父盒子一直被子元素撑开导致无法滚动（无固定宽高）
最新发布
q_xiao_jie的博客
04-01 376
今天写项目遇到一个问题 我的项目套了很多层flex盒子 且外面不知道多少层处也有个溢出显示滚动条的样式 导致我后续的组件的溢出显示滚动条的样式overflow: auto失效了(主要是我没有用固定宽高的写法，固定宽高就不会产生这样的问题 我是因为flex:1用多了) 一直撑开父元素 且用的滚动条一直是外面不知道多少层的滚动条 css上不知如何解决故用vue封了一个组件来临时解决一下。
Web前端之绝对定位父元素高度塌陷问题、接近完美的跑马灯、巧妙的计算速度、走马灯动画、文本滚动、清除浮动、相对定位、四舍五入、流水灯、坍塌、absolute
优快云博客主页地址：https://mengjian.blog.youkuaiyun.com/
04-18 2650
Web前端之绝对定位父元素高度塌陷问题、接近完美的跑马灯、巧妙的计算速度、走马灯动画、文本滚动、清除浮动、相对定位、四舍五入、流水灯、坍塌、absolute
css设置元素继承父元素宽度_CSS3 - 让元素设定的宽度和高度不被内边距撑开（box-sizing属性说明）...
weixin_39525097的博客
12-22 1319
有时我们会给页面的元素(比如div)设置个固定的高度或宽度。但如果给这个div又设置了内边距或者边框的话，那么这个div就会被撑大。也就是其实际的尺寸变成了：设置的宽高尺寸+内边距+边框。这样就有可能对我们的布局造成影响，如果不想让内边距和边框影响到我们设置的固定尺寸，可以借助 box-sizing 这个css属性来实现。1，box-sizing 属性介绍box-sizing 允许我们以特定的方式...
css笔记（二）
qq_60587956的博客
01-24 2217
笔记基于尚硅谷菜鸟教程 目录 1. 文档流 2.盒子模型 2.1简介 2.2边框 2.3盒子的内边距 2.4盒子的外边距 2.5盒子在水平方向的布局 2.6盒子在垂直方向的布局 2.7外边距的折叠 2.8行内元素的盒模型 2.9浏览器的默认样式 2.10盒子的大小 2.11盒子的阴影轮廓和圆角 1. 文档流 我们认为网页是一个多层结构，是一层一层的 可以通过css为每一次设置样式 用户只能看到最上面的一层 我们称最下面的一层叫文档流，文档流是网页的基础 我们创建的元素默认..
父元素没有被撑开
03-21
好的，用户遇到了CSS父元素高度未被子元素撑开的问题，需要解决方案。首先，我要回忆一下常见的导致父元素高度坍塌的原因。根据用户提供的引用内容，主要有两种情况：父元素坍塌和Flex子元素溢出导致的父元素被撑开...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值