具有溢出的元素:受浮动元素影响的自动

2024-02-06

有人可以向我解释一下为什么溢出有以下效果吗?

在下面的 jsfiddle 中,我有一个浮动到左侧的 Div,并设置了宽度和高度。 接下来我有一个内容 div。您可以将其视为左侧导航和网站布局的内容。

在内容中,我有两个相同的 Div,除了一个具有溢出:自动,另一个没有。带有overflow:auto的当前会尊重浮动的div并缩短其宽度以免与其发生冲突。另一个是简单地保持其完整宽度并在浮动 div 下方运行。

尽管溢出:自动提供了非常有用的行为,但我不明白为什么它关心浮动项目。我认为如果一个元素具有一定的宽度并且内部的内容无法容纳,那么它将执行您请求的行为,但这有点将该行为应用于元素本身

http://jsfiddle.net/9bEDj/1/ http://jsfiddle.net/9bEDj/1/

有人可以为我澄清这一点,并解释为什么这是这种行为,或者它是否实际上不应该这样做,这是一个怪癖!


这是关于浮动/溢出魔法的精彩描述
http://colinaarts.com/articles/the-magic-of-overflow-hidden/ http://colinaarts.com/articles/the-magic-of-overflow-hidden/

这是预期的行为,具有除可见之外的溢出的元素应该尊重浮动,因此您可以使用它而不会引起任何模糊

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

具有溢出的元素:受浮动元素影响的自动 的相关文章

  • 如何让CSS选择以字符串开头的ID(不是Javascript)?

    如果 HTML 中有这样的元素 id product42 id product43 如何匹配所有以 product 开头的 id 我已经看到了完全使用 javascript 执行此操作的答案 但是如何仅使用 CSS 执行此操作 id pro
  • jQuery 变量在定义时声称它是未定义的

    我试图在同一页面上有两个自动填充文本框 一个用于手机型号 input1 一个用于固件 input2 当两者都填充时 我希望显示一个带有ID input1input2 的div 但是当在input1 中输入值时 它声称phone 的变量未定义
  • 重新加载更新的 javascript> 代码而不完全重新加载 html 页面

    我正在开发一个单页 Web 应用程序 它具有许多不同的功能和形式 当开发一个深度 我的意思是主页上没有的 功能时 我会经历这个循环 开发代码 编辑类和函数 刷新整个页面 一路点击 直到到达我需要测试的部分 有时加起来大约一分钟 测试新代码
  • html5 canvas 上的错误显示 lineWidth=1

    I have example https developer mozilla org samples canvas tutorial 4 5 canvas linewidth html https developer mozilla org
  • Bootstrap Affix Nav 导致下面的 Div 向上跳转

    我使用 Bootstrap 的 Affix 函数创建了一个 JSFiddle 以便在向下滚动并且标题移出视图时使导航保持在屏幕顶部 我遇到的问题是 当使用纯 HTML 时 导航下方的文本会过早地跳起来并隐藏在导航后面 查看有问题的代码her
  • LESS CSS 语法对现代化很有用

    通常我使用现代化 http modernizr com 了解浏览器的功能 同时 我用LESS CSS http lesscss org 使我的CSS更具可读性和可维护性 使用 LESS 嵌套规则的常见样式如下所示 header color
  • 如果一个设置多个html标签的id属性值相同,会发生什么?

    我最近看到一个html页面 我认为几个html标签的id是相同的 然后我意识到id是唯一的 但这提出了一个问题 如果页面实际上使用了多个标签 会发生什么 正如我听说每个 html 标签 如果有的话 的 id 属性必须是唯一的 现在我想知道如
  • 在其他不可滚动的 div 上滚动时如何滚动可滚动的 div?

    我知道这个问题听起来很令人困惑 但这就是我想要做的 在下面的代码片段中 如果用户在绿色 div 上滚动 我希望黄色 div 相应地滚动 就像滚动黄色 div 一样 请注意 黄色 div 有overflow auto 但绿色的则不然 docu
  • 为什么网格项目不居中?

    由于某种原因 两个输入范围使网格中的前两项偏离中心 我假设这是因为它们的影子 DOM 样式 事实真的是这样吗 有谁知道为什么范围使项目 A 和 B 偏离中心 这是一个代码笔 https codepen io tOkyO1 pen QOeKL
  • 在流体设计中将元素的宽度调整为其高度的百分比,反之亦然? [复制]

    这个问题在这里已经有答案了 我正在制作响应式设计 无论屏幕尺寸是什么 它都必须保持其元素的比例 高度与宽度 所以我不知道任何元素的像素大小 并且我只能以 工作 我可以将宽度或高度设置为浏览器大小的百分比 但我不知道如何设置其他属性值 仅使用
  • 用于渲染 html 子集的 Django templatetag

    我有一些 html 在本例中是通过 TinyMCE 创建的 我想将其添加到页面中 但是 出于安全原因 我不想只打印用户输入的所有内容 有谁知道模板标签 最好是过滤器 只允许呈现 html 的安全子集 我意识到 Markdown 和其他人就是
  • 引导标签输入宽度

    我正在尝试使用引导程序标签输入 http timschlechter github io bootstrap tagsinput examples 以模态中包含的形式 像这样 div class form group div
  • 使用 CSS 覆盖透明 div 中的不透明文本

    我试图使透明 div 内的文本没有不透明度 也就是全黑 div style background 3cc p style background 000 This text should be all black p div 只用 CSS 就
  • Outlook 2013 渲染问题:嵌套表格截断相邻文本

    在开发 html 电子邮件通讯时 我经常使用类似于以下的结构 table width 244 border 0 cellpadding 0 cellspacing 0 tr td table border 0 align left tbod
  • PHP 共享标头而不使用服务器端脚本?

    到目前为止我总是通过 PHP 解决简单的问题 您有一个包含页眉 菜单 页脚和内容字段的网站 每个页面的页眉 菜单和页脚通常是相同的 在没有 PHP 或任何其他服务器端语言的情况下 如何使页眉 菜单和页脚数据仅存在于一个文件中 例如 您不会有
  • CSS - div 与父 div 底部对齐(内联块)

    我知道这个 html 很草率 有一些不必要的额外 div 但无论如何 我无法理解为什么 ID 为 info box right 的 div 与父 div 的底部对齐 您可以看到 文本 与下面的 jsfiddle 示例的底部 有什么想法可以让
  • 如何为 TBODY 应用垂直滚动条

    我的表中有 4 列和 5 行数据 我必须为 TBODY 应用垂直滚动条 TH 标题内容不应滚动 我对场景进行了编码 并且在我将滚动类应用于 TBODY 之前它工作正常 一旦我将滚动样式类应用于 TBODY 它就会破坏之前的对齐方式 任何人都
  • Android中webview的截图方法

    我在 webview 中的 html5 canvas 上画了一些线 并尝试使用下面的代码截取 webview 的屏幕截图 WebView webView WebView findViewById R id webview webView s
  • 在webview android中加载本地html文件

    我正在尝试在 android 的 webview 中加载 html 文件的内容 但是 它给了我 网页不可用错误 如果我尝试使用谷歌或雅虎等网站 它们就会起作用 html文件位于src gt main gt assests gt index
  • 使用 VBA 通过 Access 导航网页/操作 IE

    你好 StackOverflow 社区 我有一个关于使用 Access VBA 操作 IE 的问题 本质上 我正在尝试编写代码 使用 IE 打开特定网页 在该页面中搜索特定链接 目标链接的名称将取决于用户的情况 通过以编程方式单击该链接导航

随机推荐

  • 将 Office365 REST 日历 ID 映射到 EWS 日历项目 ID

    使用交换推送通知 https msdn microsoft com en us library aa566188 v exchg 80 aspx我一直在创建一项同步 Office365 用户的日历数据的服务 我一直在使用以下组合Office
  • 如何在 MYSQL 中获取主管姓名而不是 UserID + INNER JOIN

    这是我的表格 从用户中选择 USERID NAME STATUS 1 AAA Member 2 BBB Member 3 CCC Supervisor 4 DDD Member 5 EEE Member 从出席中选择 NO DATE SUP
  • 在自定义行为上绑定依赖属性时出错

    我正在探索 Silverlight 附加行为机制 以便在我的 Silverlight 应用程序中使用模型 视图 视图模型模式 首先 我试图让一个简单的 Hello World 工作 但我完全陷入了一个错误 无法找到解决方案 我现在拥有的是一
  • 如何计算图像是横向还是纵向

    我正在使用 jquery 创建一个图片库 有没有可能使用jquery计算图像是横向还是纵向 感谢您的支持 您可以简单地比较图像的宽度和高度 var someImg someId if someImg width gt someImg hei
  • 将类的序列化放入DLL中

    我正在寻找一个 工作 示例 用于在 DLL 中外部序列化类结构 目前我找不到任何例子 Boost 文档只是说明一些宏 论坛和新闻组只是讨论具体问题及其解决方案 所以我要求提供一个 外部 序列化类结构的示例 如下所示 除了类代码之外 我还添加
  • OSX 安装 Rsymphony - 链接标头和库

    symphony 已在终端中正确安装和测试 当尝试从源代码安装 Rsymphony 时 R 抱怨缺少标头和库 非常感谢任何指点 谢谢你 symphony安装目录 Users timo Applications symphony R安装命令
  • 使用 php str_getcsv 函数将 csv 文件数据转换为数组

    我有类似使用创建的字符串fputcsv http php net manual en function fputcsv php Date Name Hours 2013 01 02 Test User 7 59 2013 01 03 Tes
  • 将条件的“Future”更改为静态类型“bool”

    这个问题真的非常相似this one https stackoverflow com questions 54691370 flutter returning a bool type from a futurebool method 我已遵
  • 如何在 Zend Framework 2 中创建通用模块/控制器/操作路由?

    我想在 Zend Framework 2 中创建一个通用模块 控制器 操作路由 以便与 ZF2 MVC 架构一起使用 在 ZF1 中 默认路由的定义如下 module controller action 其中模块默认为default 控制器
  • 为什么我的数组中的指针指向同一个字符串?

    我试图理解为什么会出现问题 我有一个文件 我从中读取了几行 char array slave 128 int i 0 while read getline line len fp 1 if strstr line X NULL array
  • PostgreSQL 自动增量在每次更新时增加

    每次我执行 INSERT 或 UPSERT 发生冲突更新时 时 每个表上的增量列都会按之前的更新数量递增 例如 如果我有这张表 id int4 title text description text updated at timestamp
  • iPhone 上的 adhoc 应用程序安装失败,为什么?

    我正在开发一个 iPhone 应用程序 由于应用程序具有位置感知功能 因此我正在不同的地方 我不在场的地方 对其进行测试 为此 我向我的朋友发送了 mobileprovision 配置文件和应用程序临时构建 但最后应用程序安装停止在中间 在
  • TypeScript 依赖的字符串文字属性和索引

    如同Typescript 属性的类型依赖于同一对象中的另一个属性 https stackoverflow com questions 56949513 typescript type of a property dependent on a
  • 无法找到类“com.sun.facelets.FaceletViewHandler”

    我有 Richfaces 应用程序 我将其部署到 Glassfish v3 许多周 几乎 一切正常 但今天突然出现以下错误 我的 pom xml 中有 jsf facelets 1 1 14 jar 依赖项 我不知道如何解决这个问题 帮助
  • 如何运行Titanium生成的Xcode项目?

    我确信以前可以做到这一点 但我似乎无法在 Xcode 中运行 Titanium 生成的 Xcode 项目 该应用程序安装在模拟器中并启动 但立即停止 并出现以下运行时错误 Could not find the file app js 我正在
  • 清除帐户删除数据

    我想当用户手动从应用程序中删除帐户时清除应用程序的数据Accounts sync设置应用程序中的部分 我有自己的实现AbstractAccountAuthenticator但没有方法可以挂钩删除帐户过程 有什么提示吗 我一直在思考同样的问题
  • Magento 更改 div 的下拉可配置产品选项

    我需要将可配置产品的选项显示为内部带有 a 的 div 让用户在选项中单击并选择它 而不是下拉列表 就像菜单 目标是显示鞋子尺码 正如许多人所知 Magento 使用 Json 响应来填充下拉菜单的选项 var spConfig new P
  • NSDecimalNumber DecimalNumberWithString:忽略当前区域设置

    根据文档 NSDecimalNumber decimalNumberWithString 应该使用区域小数分隔符 NSDecimalSeparator 是否是句点 例如所使用的 在美国 或逗号 例如在法国使用的 取决于默认区域设置 但是当我
  • 无法启动监控且无法运行程序。为什么?

    我上周重新安装了Windows 7并解压了Eclipse并再次重新安装了SDK 但我没有在Eclipse中运行该程序 当我将 Galaxy 手机连接到计算机时 Eclipse 显示错误并频繁在控制台选项卡中写入Failed to start
  • 具有溢出的元素:受浮动元素影响的自动

    有人可以向我解释一下为什么溢出有以下效果吗 在下面的 jsfiddle 中 我有一个浮动到左侧的 Div 并设置了宽度和高度 接下来我有一个内容 div 您可以将其视为左侧导航和网站布局的内容 在内容中 我有两个相同的 Div 除了一个具有