草庐IT

关于跨浏览器:嵌套 DIV – 如何使其适用于 Internet Explorer 7?

codeneng 2023-03-28 原文

Nested DIVs - How to make it work for Internet Explorer 7?

嵌套的 div;在 Firefox-Opera-Safari 中完美运行,如何使其适用于 IE7?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>
   
   
    Heading
   
   
    Scrillablecontentblaa<br/>
    Scrillable content content content <br/>
    Scrillable content <br/>
    Scrillable content blaa<br/>
    Scrillable content <br/>
    Scrillable content <br/>
    Scrillable content <br/>
    Scrillable content <br/>
    Scrillable content <br/>
    Scrillable content <br/>
    Scrillable content
   
   
    <img src="grippie.png" style="margin-left: auto; margin-right: auto; display: block;"/>

我想要的是:最小宽度,这就是我使用浮动的原因。我正在构建一个自定义"下拉菜单",我不希望它扩展到整个页面,我希望它适合最长的字符串。

在我自己的 IE7 浏览器中,它会拉伸并填满整个页面。在所有其他浏览器(FF、Safari、Opera,可能是 ie8)中,它运行良好并且适合"最小宽度"。

  • 我不认为嵌套 标签是这里的问题。我认为这与您的 CSS 有更多关系。
  • 你能解释一下问题是什么吗?我在 IE8(兼容性视图)和 Firefox 中尝试过,看起来都很好(除了 IE 中的表格跨越了页面的整个宽度)。
  • XHTML 1.0 过渡 问题正是"在 IE 中跨越页面的整个宽度"。那不是我想要的。
  • 顺便说一句:我在那里添加了 <img/> 标记,这似乎使情况变得更糟。我需要把夹子放在中心。


"工作"?它的确切问题是什么?

对我来说,它的呈现与 IE7 中的 Firefox 等几乎相同,只要文档具有合适的标准模式 DOCTYPE。我确实看到了添加水平滚动条的问题,您可以通过在内容 div 上添加类似 overflow-x: hidden; padding-right: 24px; 的内容来解决此问题。

(问题在于,通过在没有显式 width 的情况下执行 float,您已要求缩小以适应内容宽度的行为,但确切的内容宽度取决于是否有滚动条在内容 div 上,IE 在不知道内容是否滚动的情况下无法知道,这又取决于父级的内容宽度。这个 catch-22 是 IE 感到困惑的原因;在 Quirks 模式下,它完全给出up 并使浮动全宽。这就是为什么应谨慎使用缩小以适应浮动的原因。如果您在浮动元素上设置显式宽度,则不会有任何困难。)

  • 收缩配合是我需要的。我想让它与 ie7 和 XHTML 1.0 Transitional 一起工作(否则我将不得不更改整个网络应用程序 dtd)。
  • XHTML 1.0 Transitional 是一个非常好的标准模式文档类型,是的。检查您是否将其放在文档的顶部,之前没有其他内容。做javascript:alert(document.compatMode)看它是否已经采取(应该是CSS1Compat)。
  • 当然 ; ) 它适用于您的 ie7 吗?注意底部的 img 标签 display: block (使其居中)
  • 为什么会有 display: block 恶作剧?当然只是在父 div 上带有 text-align: center 的普通图像会是最简单的吗?
  • 在 FF 中,无论是 display: block 还是 text-align center 都没有区别。但在 ie7 中,文本对齐中心再次使页脚 div 比 img 高得多。这看起来不太好。


是一个没有明确宽度的浮动 div。我认为在这种情况下,浏览器可以随意解释宽度。

如果你指定一个宽度(例如 width:50px;),它在所有浏览器上看起来都是一样的。

  • 在 CSS 2.0 中,没有宽度的浮点数与非浮点数具有相同的宽度,即。它将是全宽减去边框和填充。然而,只有 IE5/Mac 真正做到了这一点;其他浏览器进行了各种版本的缩小以适应,然后 CSS 2.1 将其设为标准(尽管不是以完全明确的方式)。
  • 顺便说一句:我在那里添加了 <img/> 标记,这似乎使情况变得更糟。我需要把夹子放在中心。

有关关于跨浏览器:嵌套 DIV – 如何使其适用于 Internet Explorer 7?的更多相关文章

  1. ruby-on-rails - Rails 编辑表单不显示嵌套项 - 2

    我得到了一个包含嵌套链接的表单。编辑时链接字段为空的问题。这是我的表格:Editingkategori{:action=>'update',:id=>@konkurrancer.id})do|f|%>'Trackingurl',:style=>'width:500;'%>'Editkonkurrence'%>|我的konkurrencer模型:has_one:link我的链接模型:classLink我的konkurrancer编辑操作:defedit@konkurrancer=Konkurrancer.find(params[:id])@konkurrancer.link_attrib

  2. ruby - 将散列转换为嵌套散列 - 2

    这道题是thisquestion的逆题.给定一个散列,每个键都有一个数组,例如{[:a,:b,:c]=>1,[:a,:b,:d]=>2,[:a,:e]=>3,[:f]=>4,}将其转换为嵌套哈希的最佳方法是什么{:a=>{:b=>{:c=>1,:d=>2},:e=>3,},:f=>4,} 最佳答案 这是一个迭代的解决方案,递归的解决方案留给读者作为练习:defconvert(h={})ret={}h.eachdo|k,v|node=retk[0..-2].each{|x|node[x]||={};node=node[x]}node[

  3. ruby - 在 Ruby 中用键盘诅咒数组浏览 - 2

    我正在尝试在Ruby中制作一个cli应用程序,它接受一个给定的数组,然后将其显示为一个列表,我可以使用箭头键浏览它。我觉得我已经在Ruby中看到一个库已经这样做了,但我记不起它的名字了。我正在尝试对soundcloud2000中的代码进行逆向工程做类似的事情,但他的代码与SoundcloudAPI的使用紧密耦合。我知道cursesgem,我正在考虑更抽象的东西。广告有没有人见过可以做到这一点的库或一些概念证明的Ruby代码可以做到这一点? 最佳答案 我不知道这是否是您正在寻找的,但也许您可以使用我的想法。由于我没有关于您要完成的工作

  4. ruby-on-rails - 浏览 Ruby 源代码 - 2

    我的主要目标是能够完全理解我正在使用的库/gem。我尝试在Github上从头到尾阅读源代码,但这真的很难。我认为更有趣、更温和的踏脚石就是在使用时阅读每个库/gem方法的源代码。例如,我想知道RubyonRails中的redirect_to方法是如何工作的:如何查找redirect_to方法的源代码?我知道在pry中我可以执行类似show-methodmethod的操作,但我如何才能对Rails框架中的方法执行此操作?您对我如何更好地理解Gem及其API有什么建议吗?仅仅阅读源代码似乎真的很难,尤其是对于框架。谢谢! 最佳答案 Ru

  5. Ruby——嵌套类和子类是一回事吗? - 2

    下面例子中的Nested和Child有什么区别?是否只是同一事物的不同语法?classParentclassNested...endendclassChild 最佳答案 不,它们是不同的。嵌套:Computer之外的“Processor”类只能作为Computer::Processor访问。嵌套为内部类(namespace)提供上下文。对于ruby​​解释器Computer和Computer::Processor只是两个独立的类。classComputerclassProcessor#Tocreateanobjectforthisc

  6. ruby - 模块嵌套代码风格偏好 - 2

    我的假设是moduleAmoduleBendend和moduleA::Bend是一样的。我能够从thisblog找到解决方案,thisSOthread和andthisSOthread.为什么以及什么时候应该更喜欢紧凑语法A::B而不是另一个,因为它显然有一个缺点?我有一种直觉,它可能与性能有关,因为在更多命名空间中查找常量需要更多计算。但是我无法通过对普通类进行基准测试来验证这一点。 最佳答案 这两种写作方法经常被混淆。首先要说的是,据我所知,没有可衡量的性能差异。(在下面的书面示例中不断查找)最明显的区别,可能也是最著名的,是你的

  7. ruby-on-rails - Nokogiri:使用 XPath 搜索 <div> - 2

    我使用Nokogiri(Rubygem)css搜索寻找某些在我的html里面。看起来Nokogiri的css搜索不喜欢正则表达式。我想切换到Nokogiri的xpath搜索,因为这似乎支持搜索字符串中的正则表达式。如何在xpath搜索中实现下面提到的(伪)css搜索?require'rubygems'require'nokogiri'value=Nokogiri::HTML.parse(ABBlaCD3"HTML_END#my_blockisgivenmy_bl="1"#my_eqcorrespondstothisregexmy_eq="\/[0-9]+\/"#FIXMEThefoll

  8. ruby-on-rails - 使用回形针的嵌套形式 - 2

    我有一个名为posts的模型,它有很多附件。附件模型使用回形针。我制作了一个用于创建附件的独立模型,效果很好,这是此处说明的View(https://github.com/thoughtbot/paperclip):@attachment,:html=>{:multipart=>true}do|form|%>posts中的嵌套表单如下所示:prohibitedthispostfrombeingsaved:@attachment,:html=>{:multipart=>true}do|at_form|%>附件记录已创建,但它是空的。文件未上传。同时,帖子已成功创建...有什么想法吗?

  9. ruby-on-rails - Rails 3,嵌套资源,没有路由匹配 [PUT] - 2

    我真的为这个而疯狂。我一直在搜索答案并尝试我找到的所有内容,包括相关问题和stackoverflow上的答案,但仍然无法正常工作。我正在使用嵌套资源,但无法使表单正常工作。我总是遇到错误,例如没有路线匹配[PUT]"/galleries/1/photos"表格在这里:/galleries/1/photos/1/edit路线.rbresources:galleriesdoresources:photosendresources:galleriesresources:photos照片Controller.rbdefnew@gallery=Gallery.find(params[:galle

  10. ruby - 如何使用 Selenium Webdriver 根据 div 的内容执行操作? - 2

    我有一个使用SeleniumWebdriver和Nokogiri的Ruby应用程序。我想选择一个类,然后对于那个类对应的每个div,我想根据div的内容执行一个Action。例如,我正在解析以下页面:https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=puppies这是一个搜索结果页面,我正在寻找描述中包含“Adoption”一词的第一个结果。因此机器人应该寻找带有className:"result"的div,对于每个检查它的.descriptiondiv是否包含单词“adoption

随机推荐