0

我正在寻找一个带有全高侧边栏解决方案的粘性页脚,并在此处部分找到它:

又一个 HTML/CSS 布局挑战 - 带有粘性页脚的全高侧边栏

标记为正确答案的帖子解释了一个简洁的解决方案,但我想知道是否可以将流体内容 div 转换为固定的,与页脚相同。(固定我的意思是固定宽度)。

内容 div 和页脚应覆盖整个屏幕的可见宽度,并且在调整大小时,它们不应随窗口调整大小。它们应该保持不变,而是出现一个滚动条。

此外,我追求的另一件特别的事情是让侧边栏有一些额外的左边距。这是小提琴:

http://jsfiddle.net/2NbMg/

<div id="wrapper">
            <div id="content">
                <div id="sidebar">Sidebar<br/>Sidebar<br/>Sidebar<br/></div>
                <div id="main">
            Content
                </div>
            </div>
            <div class="push"></div>
        </div>
<div id="footer"><div id="footer-content">Footer</div></div>

(可以在 fiddle 上找到 CSS 以保持这篇文章整洁)。

哦,如果有办法让内容从侧边栏的右侧跨越,而不是从窗口跨越,那就太棒了!

两天来我一直在寻找并试图实现这一目标,但没有成功。如果有人可以提供帮助,我将非常感激..

稍后编辑@toninoj:

再次感谢您的意见,我很抱歉没有这么明确。基本上,我希望页脚占据全宽,尤其是在宽屏和笔记本电脑上。我想远离 100% 宽度的原因是我希望我的页脚在调整窗口大小(变小)时仍然很大,而不是在调整大小或根据窗口大小进行调整。页脚将包含大量数据,并且在调整大小时看起来很糟糕。

我可以投入大量像素以保持其宽度固定,但这不会在笔记本电脑上造成问题吗?(滚动条出现虽然不是必需的)

4

1 回答 1

0

您需要指定元素的确切宽度,例如width:200px;,您应该给它position:fixed以使其具有粘性。你也应该给它overflow:scroll;

如果您想要一个没有滚动条的固定宽度页脚,您只需指定类似

width:1600px;
overflow:hidden;
于 2012-11-14T18:44:28.260 回答