加overflow:auto不起作用解决办法

已于 2022-08-28 19:36:13 修改
阅读量1.9k 收藏 3
点赞数 2
文章标签： html5 html css
于 2021-08-28 08:19:11 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_43405603/article/details/119963362
版权

如果你加的高度是100%，把它改成100vh就好了

原因如下：

     1、% 是相对于父元素的大小设定的比率，用 % 在没有设置 body 高度的话，是无法正确获得可视区域的高度的

     2、vw、vh 是视窗大小决定的，能够直接获取高度

一只桃子~
关注
[Html]overflow: auto 失效原因,flex 1却未设置min-height &overflow的几个属性以及应用场景
警警的博客
03-31 924
• overflow失效核心：容器尺寸未定义、Flex 布局未限制最小尺寸、定位冲突。•流式滚动本质：动态内容更新 + DOM 操作触发滚动定位。•进阶场景：结合虚拟滚动技术（如）处理海量数据渲染。
文字过长使用省略号展示，text-overflow 的使用和不生效场景的解决办法，flex 布局中文字省略展示的坑
最新发布
有一棵树的博客
04-25 1101
文字过长使用省略号展示，text-overflow 的使用和不生效场景的解决办法，flex 布局中文字省略展示的坑
微信小程序overflow:auto; ios设备卡顿问题
01-03
我们在开发微信小程序的时候，经常会使用到overflow:auto;来实现局部滚动效果，稍微注意的码有就会发现，ios真机设备上会有很明显的卡顿，但安卓设置就没这个问题。 解决方式 view{ overflow:auto; -webkit-overflow-scrolling: touch; } 给 overflow 属性添加-webkit- （chrome、safari私有属性） 友情提醒：我推荐你使用微信小程序scroll-view组件实现局部滚动功能，scroll-view微信已经做好了兼容问题，不会出现这种不兼容的问题。用的时候记得给height设值哦
设置overflow:auto无效的解决办法(避坑)
hellozhxyuan
06-15 3048
做项目避免不了使用overflow 但是设置了之后是无效的 这个时候要查看所在的元素是否的父元素是否在所在元素 给父级添加属性 注：宽高大于父级元素的宽高
关于使用overflow-y auto不生效的问题
qq_40703755的博客
12-20 7450
如果父容器高度为百分比，子容器根据父容器百分比设置，整个overflow属性都会失效。实现overflow的效果必须有一个固定高，父容器也必须是固定的高。
overflow:auto 不生效的原因
热门推荐
sdewendong的专栏
11-24 3万+
今天给我的一个div加滚动条的样式，overflow:auto ，死活不生效。 最后发现问题：为div指定overflow属性为auto没问题，但是必须指定div的高度，例子： <div style="position:absolute; height:300px; overflow:auto"> </div> position:absolute 可加可不加，自己试...
overflow：auto失效
蔡徐坤加入博客园的博客
12-24 897
如果是div，可能是div宽度和高度没有写，所以overflow失效
ie7中overflow:auto无效的解决方法
12-13
解决办法解决这个bug很简单，在父元素中使用position:relative;即可解决该bug。 代码bug重现 复制代码代码如下:<ul><li>我是很努力的前端博客，希望你会喜欢</li><li>我是很努力的前端博客，希望你会喜欢</li><li>我...
UniApp + Vue3 + Vite + TS + Tailwind 跳转页面，给跳转的页面设置了 overflow:hidden不管用，还是回滚动
03-15
### 可能的原因及解决办法 #### 1. **未正确应用样式** - 确保你在正确的容器上应用了 `overflow: hidden` 样式。通常需要检查的是根元素 `.page` 或者 `<view>` 容器。 ```html <!-- 页面内容 --> ...
-webkit-overflow-scrolling:touch; ios橡皮筋效果卡屏，滚动穿透 --已解决
fly_wugui的博客
05-30 2662
-webkit-overflow-scrolling 属性 MDN中概述 入下 -webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果. 值选项 1、auto 使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止 2、touch 使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的...
关于使用overflow-y:auto；不生效的问题
Jet_Lover的博客
12-15 1万+
使用overflow-y: auto;不生效
解决css上overflow:auto不生效问题
weixin_45036647的博客
10-25 790
拿到前辈的代码屎山时，想要在一个div上添加属性overflow:auto;发现有滚动条但不滚动的问题。（无滚动效果）
css中overflow-x:auto无效
Amouzy的博客
02-25 6008
css中overflow-x:auto无效
overflow-y:auto;不生效的问题
TU_BO的博客
04-04 9450
今天进行一个页面的样式调试,发现overflow-y:auto;不生效 最后发现是overflow-y:auto;对table标签不生效,如果要对一个table进行滚动,必须在table外加一层div,然后对其设置高度 页面代码 <div class="myclass"> </div> css样式代码 .myclass{ overflow-y:auto; ...
ie6 overflow:auto不起作用的情况
管子（zero）的杂乱空间
10-23 1137
今天遇到一个比较特殊的情况：ie6下设置overflow:auto不起作用，在火狐下正常显示。ie下滚动条是出来了，但是内容却跑到下面去了，滚动条行同虚设。网上搜索了一下都说是设置高度和宽度就ok了，开始还以为是百分比高度引起的，但设置成绝对高度200px后还是不行。最后通过经验判断出原来是overflow的那个div没有position定位，给加了个定位和top,left属性后一切都正常了！汗，
关于body中设置overflow:auto不生效解决方案
heerey525
12-18 6145
我遇到的情景，在一个项目之前的框架中，嵌入一个iframe页面，发现超出页面之后不显示滚动条 ok，那我自己给body加一个overflow:auto; 发现没有解决问题 我对比之前的别的页面，发现也有这样的超出的内容，发现在body添加还要设置高度，嗯我又给body加了一个height:100%;嗯哼我觉得正常情况下是可以的了，但是很happy我经常遇到不正常的情况，我打开控制台看到上...
ionic overflow:auto失效
weixin_30598225的博客
07-07 123
事情的起因是 同事上传一个很宽的table文件，因为手机屏幕宽度有限，因此要求 用户可以水平滚动页面，这样table的内容通过滚动就可以实现啦。 当时感觉很简单 给table外面的容器加个overflow:auto;就可以了呗； 然而，，，安卓是没问题的，ios却不行，死活滚动不了。 于是想到用ionic中的滚动来实现，ion-scroll; <ion-scroll zooming=...
iOS Safari浏览器上overflow: scroll元素无法滑动bug解决方法整理
weixin_33851429的博客
01-09 3587
描述 此bug出现需要条件：父元素需使用绝对定位absolute或固定定位fixed，使用overflow: scroll / auto（或overflow-y: scroll / auto)，内部子元素是动态大小（例如较大的svg document，近似为内嵌iframe，等等）。 bug出现原因：没有相关官方文档描述该bug。在查阅文...
关于HTML下overflow-y:auto无效、清除HTML默认边距、解决去除手机访问网页时的左右多余空白的三个方法汇总
sinolzeng的专栏
11-22 1万+
在html中，如果想让某个子DIV出现over-flow
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值