css - Div 容器边距不相对于前一个 div

标签 css html

好的,我有一个问题,当浏览器窗口重新调整大小(高度不是宽度)时,一个 div 的边距似乎没有相对于前一个 div 保持不变。这会产生内容重叠的问题,如在宽浏览器中显示的那样。下图显示了它在窄屏幕中如何正常工作,但是在第二张图片中,您可以看到 div 如何根据浏览器变宽(27 英寸 imac)而向上移动。

Narrow Screen

enter image description here

如果您转到:http://creativeabyss.co.uk/test/当您调整窗口大小时,您可以自己看到这种效果(您可能需要一个大显示器)。我一生都无法弄清楚是什么原因造成的,所以我想知道你们中是否有人可以提供帮助?该代码应该可以在上述链接中找到。

p.s 我已经将一个 div 的背景设置为蓝色,这说明似乎是这个 div 的大小导致了问题...

最佳答案

您的问题是 #OuterMenu 上的固定高度。设置为300px,当你调整浏览器窗口大小时,#OuterMenu里面内容的高度变小了,但是#OuterMenu还是300px 高,这会导致在其下方呈现的内容之前显示一些空白区域。摆脱 #OuterMenu 上的固定高度将解决此问题。它在高分辨率下中断,因为 #OuterMenu 中的内容对于它包含的 div 来说太高了,它只有 300px 高。在这种情况下,看起来 div 下面的内容呈现在 #OuterMenu 内容的顶部,但实际上它是 300px#OuterMenu 上设置的高度限制了 #OuterMenu 在其中呈现其内容所允许的空间。

关于css - Div 容器边距不相对于前一个 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16824914/

相关文章:

html - HTML 中的分页符

javascript - 从元素中删除类后,IE6 不会更新样式

javascript - 如何在 php 循环函数上应用 html/css

PHP使用单选按钮的值

html - 使用可重复使用的样式以方便使用,但最适合网站速度?

html - 即使使用 !important,字体大小也会被覆盖

javascript - 如何使除某些部分外的整个页面变黑?

html - CSS 打印布局 - 在单页上打印

javascript - Bootstrap Accordion 在表格内切换并在单击时更改所选行的背景颜色

internet-explorer - 如何修改 IE Gradient CSS 以使用高度和第三种颜色?