解决火狐浏览隐藏不了滚动条问题

1.里层容器的width多17px，外层容器溢出隐藏，能兼容各个浏览器

.outContainer {

　　width:350px;

　　height:300px;

　　overflow: hidden;

}

.inContainer {

   height:300px;

   width: 367px;

   overflow-x:hidden;

   overflow-y:scroll;

}

2.设置 scrollbar-width: none，可兼容

.outContainer {

　　width:350px;

　　height:300px;

　　overflow: hidden;

}

.inContainer {

   height:300px;

   width: 350px;

   overflow-x:hidden;

   overflow-y:scroll;

   scrollbar-width: none;

}

/* 使用伪类选择器 ::-webkit-scrollbar ,兼容chrome和safari浏览器 */

.inContainer::-webkit-scrollbar{

    display: none;

}

/*兼容火狐*/

.inContainer {

   scrollbar-width: none;

}

/* 兼容IE10+ */

.inContainer {

    -ms-overflow-style: none;

}

html如下

<body>

    <div class="outContainer" >

        <div class="inContainer">

            <div class="inContent" ></div>

            <div class="inContent inContent2"></div>

            <div class="inContent" ></div>

        </div>

    </div>

</body>

　　

　　

css 之内容溢出滚动，隐藏滚动条（解决火狐浏览隐藏不了滚动条问题）的更多相关文章

  1. [CSS]overflow内容溢出

      定义和用法 overflow 属性规定当内容溢出元素框时发生的事情. 说明 这个属性定义溢出元素内容区的内容会如何处理.如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制.因此,有 ...

  2. jqprint导入jqgrid表格时，内容溢出的原因以及解决方法

    jqprint在导入表格的时候,会将原表格的样式全部拉过来,所以说原表格(如jqgrid的表格)的内容在有滚动条的时候,必须得将宽度设置为100%(等百分比的宽度),不能设置成固定宽度,不然表格内容会 ...

  3. CSS应用内容补充及小实例

    一.clear 清除浮动 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  4. CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法

    CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱. 这样我们就需要解决如何使用CSS来超出设 ...

  5. 解决boostrap-table有水平和垂直滚动条时，滚动条滑到最右边表格标题和内容单元格无法对齐的问题

    问题:boostrap-table有水平和垂直滚动条时,滚动条不高的时候(滚动高度比较大的时候没有问题),滚动条滑到最右边表格标题和内容单元格无法对齐的问题 问题原因:bootstrap-table源 ...

  6. css设置滚动条并显示或隐藏

    看效果,没有滚动条,超出div,开发中肯定不行. 有滚动条 最后就是想隐藏滚动条 代码 有滚动条并显示 <!DOCTYPE html> <html lang="en&quo ...

  7. CSS：overflow 内容溢出属性

    overflow 属性规定当内容溢出元素框时发生的事情 值 描述 visible 默认值.内容不会被修剪,会呈现在元素框之外. hidden 内容会被修剪,并且其余内容是不可见的. scroll 内容 ...

  8. 滚动条ScrollViewer防止滚动时按内容跳跃式滚动的设置

    原文:滚动条ScrollViewer防止滚动时按内容跳跃式滚动的设置 属性中将CanContentScroll设置为False,滚动时就不会跳了,会连续的滚动

  9. CSS基础 overflow 内容溢出部分显示效果

    属性:overflow 值 作用 visible 默认,内容溢出部分可见 hidden 内容溢出部分不可见 scroll 内容有无溢出,都有滚动条 auto 有内容溢出,自动显示滚动条

随机推荐

  1. python抽取指定url页面的title方法

    python抽取指定url页面的title方法 今天简单使用了一下python的re模块和lxml模块,分别利用的它们提供的正则表达式和xpath来解析页面源码从中提取所需的title,xpath在完 ...

  2. nginx服务报错解决

    403禁止访问解决 . 重要:修改配置文件使用虚拟机,否则怎么配置都不生效,添加如下用户 [root@host---- html]# ll /etc/nginx/nginx.conf -rw-r--r ...

  3. [leetcode_easy]558. Quad Tree Intersection

    problem 558. Quad Tree Intersection re 1. Leetcode_easy_558. Quad Tree Intersection; 2. Grandyang; e ...

  4. Linux使用mount挂载Windows共享文件夹

    https://blog.csdn.net/tojohnonly/article/details/71374984 https://github.com/tojohnonly 现实中会有这样的场景 , ...

  5. Flutter的闪屏动画案例AnimationController

    打开一个APP,经常会看到精美的启动页,这种启动页也称为闪屏动画.它是从无到有有一个透明度的渐变动画的.图像展示完事后,才跳转到用户可操作的页面. AnimationController Animat ...

  6. WhatsApp Group vs WhatsApp Broadcast for Business

    WhatsApp Group vs WhatsApp Broadcast for Business By Iaroslav Kudritskiy If you've read our Ultimate ...

  7. KVM虚拟化介绍（1）

    一.虚拟化分类    1.虚拟化,是指通过虚拟化技术将一台计算机虚拟为多台逻辑计算机.在一台计算机上同时运行多个逻辑计算机,每个逻辑计算机可运行不同的操作系统,并且应用程序都可以在相互独 立的空间内运 ...

  8. NMS(Non-Maximum Suppression) 非极大值抑制

    NMS  非极大值抑制:找到局部最大值,并删除邻域内其他的值. 简单说一下流程: 首先剔除背景(背景无需NMS),假设有6个边界框,根据分类置信度对这6个边界框做降序排列,假设顺序为A.B.C.D.E ...

  9. Unstanding LSTM

    1.RNNs 我们可以把RNNs看成一个普通网络做多次复制后叠加在一起组合起来,每一个网络都会把输出传递到下一个网络中. 把RNNs按时间步上展开,就得到了下图: 从RNNs链状结构可以容易理解到他是 ...

  10. IdentityServer4学习记录

    前言 .NetCore 生态伴随着各位大神的推广,好多小伙伴都学习或应用到现有项目中了:  同时,很多相关组件也提上了学习之旅,如IdentitiServer4.Polly.Ocelot.Consul ...