标头不符合 100% 宽度

header not complying to 100% width

本文关键字:宽度 100% 不符合      更新时间:2023-09-26

请查看此网站:

http://www.imageworkz.asia/cranium

尝试将窗口大小调整到显示水平滚动条的程度。将水平滚动条向右拖动,然后出现问题。页眉和页脚似乎没有相应调整。在 css 中,页眉和页脚元素的宽度为 100%。

关于如何解决这个问题的任何想法?谢谢!

这就是 100% 宽度的工作原理。元素的宽度与父元素相同,并且由于存在滚动条,因此它比页面窄。

我没有

看到问题,但是如果您希望标题调整大小,我建议您使用媒体查询根据屏幕尺寸进行调整。

媒体查询示例

文章元素具有固定宽度,因此当容器收缩时它会溢出容器。 您可以尝试浮动容器div,这应该确保它不会缩小。

<div id="container" style="display: block; float: left">
您需要对'body'元素使用 CSS3

多个背景图像,然后使用 CSS3 PIE 使其在 IE http://css3pie.com/documentation/supported-css3-features/#pie-background 中工作

body{
    background: url("/cranium/img/2 MAIN/bg.jpg") repeat 0 40px, url(headerbg.png) repeat-x left top, url(footerbg.png) repeat-x left bottom;
    -pie-background: url("/cranium/img/2 MAIN/bg.jpg") repeat 0 40px, url(headerbg.png) repeat-x left top, url(footerbg.png) repeat-x left bottom;
    behavior: url(PIE.htc);
}

请记住-pie-background相对于HTML的,而不是CSS的这肯定会解决您的问题。