1

我有一个带有骨架样板的简单的两列响应式设计。对于侧边栏,我有这个div,在容器 div内:

 <div class="container">
    <div class="four columns">
       /* logo and menu */
    </div>
    <div class="nine columns post">
       /* contents... */
    </div>
 </div>

我喜欢它在宽视口中的外观以及它如何堆叠在较窄的视口上,但我希望更宽尺寸的侧边栏(四列 div)始终固定在左侧,同时滚动另一个div的内容。

尝试了几件事,但最终搞砸了响应式布局,我想我对 CSS 定位没有全面的了解......

任何帮助表示赞赏!谢谢。

4

2 回答 2

3

我读到您正在使用 Skeleton Boilerplate。

我建议您将徽标和菜单放在一个<nav>元素中。关闭时</nav>,插入一个不间断的空格 ( &nbsp;)。这个不间断的空间有望解决您的问题!

 <div class="container">
    <div class="four columns">
       <nav>
       /* logo and menu */
       </nav>
       &nbsp;
    </div>
    <div class="nine columns post">
    /* contents... */
    </div>

接下来要做的是转到您的 CSS 文件并插入:

nav{ position:fixed; width:220px; /*found the width-info on Skeleton website*/ }

让我知道它是否适合你!

于 2012-11-14T20:59:18.370 回答
0

为此,您需要有一个“粘性” div

尝试使用航点

于 2012-11-07T04:21:11.403 回答