当overflow-x:hidden存在时,overflow-y:visible不起作用[重复]

2024-02-08

在 Chrome 或 Firefox 中无法正常工作。有什么解决方法吗?

   <!DOCTYPE html>
   <html>
   <head></head>
   <body>
    <h3>overflow-y:visible</h3>

    with overflow-x:hidden
    <div style="overflow-x:hidden;overflow-y:visible;width:100px;height:100px;   position:relative;background:#666;">
        <div style="top:20px;left:20px;    width:420px;height:420px;position:absolute;background:#420;">
        </div>
    </div>

    without overflow-x:hidden
    <div style="overflow-y:visible;width:100px;height:100px;position:relative;background:#666;">
        <div style="top:20px;left:20px; width:420px;height:420px;position:absolute;background:#420;">
        </div>
    </div>

   </body>
   </html>

http://jsfiddle.net/sMnyK/ http://jsfiddle.net/sMNyK/

现实生活中的场景涉及的组件绝对必须具有 Overflow-x:hidden,但这将触发需要能够在 y 方向上脱离元素的弹出菜单。我应该将这些菜单放置在其父组件之外,还是有更好的解决方案?


这可能与此处解决的问题有关:CSS 溢出-x:可见;和溢出-y:隐藏;导致滚动条问题 https://stackoverflow.com/questions/6421966/css-overflow-x-visible-and-overflow-y-hidden-causes-scroll-bar

简而言之,当使用visible对于任一overflow-x or overflow-y以及除此之外的其他东西visible对于另一个,则visible值被解释为auto.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

当overflow-x:hidden存在时,overflow-y:visible不起作用[重复] 的相关文章

  • 我可以在元标记中使用 HTML 字符实体吗?

    我有一个有两种语言的网站 英语和中文 在使用 UTF 8 字符集的英文主页中 我有 例如 这出现在搜索结果中 我想将其更改为 在哪里 20013 25991 是 中文 的 ISO 实体 搜索结果中会显示为 中文 吗 我无法将 中文 直接粘贴
  • 使用反增量更改 z-index

    我尝试制作一个图像滑块 当鼠标悬停在一个点上时 它将显示图片 我也尝试使用在图像之间切换z index但什么也没动 slider counter reset index 1000 slider input name slide switch
  • 如何在 select2 下拉列表中换行?

    我正在使用 select 2 下拉菜单 然后在其内容中显示一些长句子 我想在句子的正确位置添加换行符 但下拉菜单是自动调整的 For example the content of the dropdown right now looks l
  • 如何在不使用变换或顶部/左侧的情况下转换列表中项目的位置

    有一天我偶然发现一个例子 https codepen io itslit pen gvKrMY它使用 Vue js 但我的问题更多是关于 Vue 用于实现状态之间转换的 CSS 和 HTML 卡片暂时获得等级 shuffleMedium m
  • 我如何能够以两行显示标题,并且每行的字体大小不同?

    我正在使用 Google Chart API 创建时间线图 并希望将图的标题修改为两行 问题 我如何能够显示具有不同字体大小的两线图表标题 电流输出 理想输出 相关研究 我唯一能找到的是有人试图用饼图来做到这一点 但我尝试了但无法使其发挥作
  • 暂停除了已激活的玩家之外的所有其他玩家。

    我有这个插件 它可以将不同的样式应用于 html5
  • socket.io 的良好初学者教程? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 在表格上使用上下文样式将点边框应用于特定单元格

    我以前有过问了一个问题 https stackoverflow com questions 6326266 issue with applying dotted border to cells in table design在这个问题上 你
  • 悬停此元素时隐藏元素后的伪元素

    我的菜单垂直放置在页面左侧和菜单之间 li 我有一个 after那是一个分隔符 我想要的是当我悬停元素本身 如果它是第一个元素 时隐藏 after 元素 或者当它是中间元素时隐藏上面和底部的元素 如果它是最后一个子元素 则隐藏 after前
  • 如何在codeigniter中将上传图片比例限制为16:9?

    这是我用来上传图像的代码 this gt load gt library upload ext pathinfo file name PATHINFO EXTENSION img name now ext imgConfig upload
  • 图像无法在带有 DOM 的 IE 中加载:控制台中的 7009 错误(无法解码)

    当在 IE 中的单个页面上加载许多图像时 在 IE11 中重现 其中一些图像开始加载失败 并在控制台中出现类似以下警告的内容 DOM7009 无法解码 URL 处的图像 某些唯一的 url 当我查看网络流量时 似乎确实从服务器收到了每个图像
  • 为 Angular2 中的组件加载多个样式表

    我正在构建一个 angular2 应用程序 当我尝试为同一组件加载多个样式表时 我面临多个问题 这是我正在做的代码 import Component from angular core Component selector my tag t
  • CSS 类命名约定

    在网页上 有两个控件块 主要和次要 大多数人会使用什么类名 选择一 div class primary controls div
  • php - 解析html页面

    div divbox div p para1 p p para2 p p para3 p table class table tr td td tr table p para4 p p para5 p 有人可以告诉我如何解析这个 html
  • 尝试将数据存储在点击器网站中

    我正在尝试存储一个名为的变量score无论何时刷新 您都会一次又一次地使用它 我不明白的是它的代码是什么 我尝试了一些方法 但似乎都不起作用 这是我的答题器网站 但是当我尝试使用 JavaScript 来存储它时 它不起作用window o
  • 使用 CSS 使一行 div 高度相同

    我有一排必须具有相同高度的 div 但我无法提前知道该高度可能是多少 内容来自外部源 我最初尝试将 div 放置在封闭的 div 中并将它们向左浮动 然后我将它们的高度设置为 100 但这没有明显的效果 通过将封闭 div 的高度设置为固定
  • 可以设置标题样式吗? (并且使用CSS或js?)[重复]

    这个问题在这里已经有答案了 我想知道是否可以设计一个title a href title This is a title Hello a 样式问题有两个方面 文本格式 编码 我猜这是可能的 所以在问题中这样做 工具提示样式 你能把它弄大一点
  • 在移动设备上滚动

    这个问题更多的是一个建议研究 我确实希望它对其他人有帮助 并且它不会关闭 因为我不太确定在哪里寻求有关此事的建议 在过去的 6 个月里 我一直在进行移动开发 我有机会处理各种设备上的各种情况和错误 最麻烦的是滚动问题 当涉及到在网站的多个区
  • 使用css bootstrap时如何仅向一列添加右边框?

    我正在尝试使用CSS引导框架 http getbootstrap com css tables在我的项目中 我正在使用带有以下类的表table table bordered table striped 我想删除除第一列之外的所有列的边框 这
  • CSS溢出文本显示在几行中,没有断字

    我有一些长文本显示在 div 中 该 div 具有固定的宽度和高度 我希望文本显示在几行上 作为 div 高度 并且句子单词不会中断 一行中的单词前缀和下一行中的继续 此外 我想在末尾添加省略号最后一句话 CSS white space n

随机推荐

  • 确定隐马尔可夫模型中隐藏状态的数量

    我正在学习隐马尔可夫模型 用于对 t 个图像帧序列中的运动进行分类 假设每个帧有 m 个维度的特征 然后我将它聚集成一个符号 用于可观察的符号 我为 k 类创建 k 个不同的 HMM 模型 那么 如何确定每个模型的隐藏状态数量以优化预测 顺
  • 密码保护 iPhone 应用程序

    我正在启动一个新应用程序 我想知道如何需要密码才能打开它 我正在考虑一个UIActionSheet在应用程序中didFinishLaunchingWithOptions应用程序委托实现文件的方法 但我不确定如何去做 不过我会继续努力 Fou
  • AngularFire $add 操作导致浏览器冻结

    我正在使用 angularjs 学习 Firebase 从本教程https thinkster io tutorials angularfire realtime slack clone creating the channels side
  • 在 Java 中对双精度值进行哈希处理

    我想知道如何在 Java 中对 double 进行哈希处理 我已经散列了其他原始数据和对象 我想我可以使用 hashcode 方法吗 从我所看到的来看 这看起来相当复杂 我遇到了一些关于创造种子的事情 我想知道关于如何解决这个问题的任何想法
  • 制作通用数组是不好的做法吗?替代方案是什么?

    我在学校用 C 编码已经三年了 两天前我开始用 Java 编码 我的问题是 制作通用数组是不好的做法吗 另一种选择是什么 我很困惑 除了做一些奇怪的事情 例如这个例子 之外 我似乎无法制作通用数组 Class implementing th
  • 对象中对象中的 JavaScript `this`?

    抱歉 帖子标题模糊 我无法为这篇文章制定正确的英文名称 例如我有这样一个对象 var APP a 1 b function return this a 这样 如果我打电话console log APP b than this将引用 APP
  • 如何重置 Kafka 偏移量以匹配尾部位置?

    我们将 Storm 与 Kafka 和 ZooKeeper 结合使用 我们遇到过这样的情况 我们必须删除一些主题并用不同的名称重新创建它们 除了现在读取新主题名称之外 我们的 Kafka spouts 保持不变 但是现在 当尝试从新主题读取
  • 在 fluidd 中解析 nginx 入口日志

    我想在 Kubernetes 中使用 Fluentd 解析入口 nginx 日志 这在 Logstash 中相当简单 但我对 fluidd 语法感到困惑 现在我有以下规则
  • Greenlet 运行时错误和在 docker 中部署的应用程序不断启动所有工作人员

    RuntimeWarning greenlet greenlet 大小已更改 可能表示二进制 不兼容 预期来自 C 标头的 144 从 PyObject 得到的为 152 所有的工人都被解雇了 2020 09 28T14 09 41 864
  • 使用 spring 3.x 配置速度工具

    我对弹簧和速度都很陌生 我想使用 spring 3 x 配置速度工具 但我找不到相关的好文章 速度模板未显示会话变量 我从 Spring 控制器设置 至于在spring 3 x中配置Velocity工具 首先将tools xml文件放在有用
  • Java 新手,出现错误“int 无法取消引用”

    我是 java 新手 我已经从事这个练习有一段时间了 但不断收到错误 int 无法取消引用 我看到了几个类似的问题 但仍然无法弄清楚我自己的情况 这是完整的代码 package inclass class OneInt int n OneI
  • 如何在角度2中等待函数完成执行?

    下面是我的代码 我想要login and authenticated 等待的函数getProfile 函数来完成其执行 我尝试了多种方法 例如承诺等 但无法实现 请建议我解决方案 import Injectable from angular
  • 从服务器视频链接生成缩略图 android

    在android中是否可以获取某人的任何类型视频的缩略图 该人仅具有该视频的url链接 并且视频可以来自任何来源 例如youtube或任何来源 请告诉我是否可能 这是我的我试图通过java代码获取youtube视频的缩略图 public c
  • jQuery 延迟和承诺 - .then() 与 .done()

    我一直在阅读有关 jQuery deferreds 和 Promise 的内容 但我看不出使用之间的区别 then done 成功回调 我知道埃里克 海因兹 http www erichynds com jquery using defer
  • java.lang.NoSuchFieldError:android.support.v7.appcompat

    我将我的支持库从 r20 更新到了 r21 现在当我运行我的应用程序时 我收到此错误super onCreate我的主要活动 java lang NoSuchFieldError android support v7 appcompat R
  • iOS:将视图转换为圆柱形

    借助 Quartz 2D 我们可以改变对事物的看法x yand z axis 在某些情况下 我们甚至可以通过更改矩阵的值使它们看起来像 3D 我想知道是否可以将视图转换为圆柱体形状 如下图所示 请忽略气缸的顶部 我更好奇是否有可能扭曲UIV
  • Inno Setup:如何处理[UninstallDelete]部分的进度条?

    我使用 Inno Setup 为我的应用程序制作安装程序 当用户卸载应用程序时 我想删除其中的自定义文件夹Program Data文件夹 我的文件夹很大 大约15 GB 所以我使用 UninstallDelete 删除此文件夹的部分 Uni
  • 用于搜索引擎风格搜索的 JavaScript 库? [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 是否有一个 JavaScript 库可以确定字符串是否与搜索查询匹配 它应该高效并提供高级查询功能 如
  • 在 JSDoc 中记录开放式参数函数的正确方法

    假设您有如下内容 var someFunc function do something here with arguments 您如何正确记录该函数可以在 JSDoc 中接受任意数量的参数 这是我最好的猜测 但我不确定它是否正确 param
  • 当overflow-x:hidden存在时,overflow-y:visible不起作用[重复]

    这个问题在这里已经有答案了 在 Chrome 或 Firefox 中无法正常工作 有什么解决方法吗 h3 overflow y visible h3 with overflow x hidden div style width 100px