gpt4 book ai didi

html - 忽略 CSS 文本底部边距

转载 作者:技术小花猫 更新时间:2023-10-29 11:59:36 27 4
gpt4 key购买 nike

好吧,我希望这不是一个简单的疏忽,但我已经为此工作了几个小时!

我正在处理的页面上有一个相当复杂的 HTML/CSS 结构。我在页面的最底部有一个文本,它位于一个底部边距为 10px 的 div 中;。该 div 在另一个底部边距为 10px 的 div 中;。那个 div 在链上的其他 div 中,直到 <body>。 .

出于某种原因,文本正好靠在它所在的 div 的底部。我创建了一个极简主义的复制品供人们查看。它确实重现了这个问题,我只是希望我没有删除任何其他导致该问题的问题。

我确实让它在最新的 chrome 中工作了一个高度:100%;那里的某个地方(我现在不记得在哪里了)但是它没有解决 firefox 和 ie 中的问题。这两个浏览器在使用该 css 时都有奇怪的行为,它们最初以正确的底部边距大小显示,但立即跳回向下,因此文本再次没有底部边距。就像一个小光点。

哦,在我的 repro html 中,ie 也没有显示任何居中的内容(至少 ie9)。我希望这不会成为问题。我自己当然可以很容易地解决这个问题。

在 chrome 中,如果您检查元素,它会以蓝色突出显示文本 div,蓝色边界框显示 div 超出了当前显示的位置。

这是一个极简主义的例子:http://www.del337ed.com/repro.html

感谢大家的意见/帮助。

最佳答案

添加overflow: hidden#SubmissionDetails通过阻止 collapsing margins 的行为来解决 margin 问题在那div .

添加文档类型作为转义的第一行Quirks Mode并在 Internet Explorer 中修复您的页面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

(您也可以使用更短的 <!DOCTYPE html> ,我只是坚持使用您所拥有的)

进行此更改还将改进其他浏览器中的内容(即,它将提高一致性)。

关于html - 忽略 CSS 文本底部边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7362002/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com