Question

我在避免使用侧栏与tumblr上的博客主要内容重叠时遇到了问题。我在tumblr上使用预制模板，我已修改过。我可以将我的侧边栏放在右上角的唯一方法是使用绝对或固定位置：

#sidebar{
position:fixed;
top:20px;
right:20px;
}

使用时，例如在我的主要内容之后，侧边栏位置本身位于底部。

我的网页构建如下：

<body>
    <div id="page">

        <div id="header">
        </div>
        <div id="content">
        </div>

    </div>

    <div id="sidebar">
    </div>

</body>

点击here查看该页面。我尝试将我的侧边栏放在页面div中，但宽度有一个约束，我想保留。提前谢谢。

Answer 1

根据您的最新评论，这可以帮助您解决问题：

您可以在页面上设置最小宽度，稍微重新排列标记，并删除侧栏上的某些样式。如果您现在保留所有类似内容，那么以下内容将有所帮助：

在min-width: 1250px;代码

body

将sidebar元素移至page元素
从position: fixed;元素

sidebar

这将阻止菜单重叠页面内容，并在用户窗口小于1250px时向页面添加水平滚动条。如果您想支持较小的最小宽度，或者如果您遇到背景图像不能以小分辨率为中心的问题，则需要进行微小的修改。

使用CSS定位避免使用tumblr上的侧边栏重叠内容

1 个答案: