我正在设计一个新网站(现在它远非任何东西),但我正在努力调整其中的内容,实际窗口大小。图片讲千言万语。第一张照片是正确的方式,下面是我调整窗口大小时的方式。
<div class="header">
<div class="hdrmast-topbar">
<div class="container">
<span>Test :: Link 1 | Link 2</span>
</div>
</div>
我将在标题部分中有两个小节,其中一个是代码中的hdrmast-topbar。父项将被修复,并随着滚动一起移动。但是,我希望内容可以通过窗口调整大小,例如:http://incub.ro/
此刻,标题处于相对位置状态,因为我正在尝试此事。
/* Header */
.header { min-width: 100%; position: relative; }
.hdrmast-topbar { background-color: #000; width: 100%; max-height: 25px; font-size: 11px; color: #fff; font-weight: bold; text-align: right; padding-top: 5px; padding-bottom: 5px; }
.hdrmast-topbar span { margin: 0; padding: 0; }
/* Global */
.container { width: 1120px; margin: 0 auto; }
谢谢。
答案 0 :(得分:2)
只需删除
.container { width: 1120px;
使用width: 100%;
而不是......
答案 1 :(得分:2)
您可以为容器指定最大宽度为1120px,宽度为100%。
.container{
margin: 0 auto;
background:blue;
max-width:1120px;
width:100%;
}
JsFiddle:http://jsfiddle.net/tDjA9/2/embedded/result/
希望这有帮助,并且我理解你的问题是正确的......: - )
编辑 -
要获得与您发布的网站相同的效果,您需要使用position:fixed。
我创建了一个新的jsfiddle来展示这个。 http://jsfiddle.net/tDjA9/6/embedded/result/: - )