可以使用float:right堆叠2个侧边栏

时间:2013-10-07 18:35:06

标签: html css css-float stack sidebar

我几乎到处都在寻找解决方案......

无论如何,我试图将两个侧边栏“堆叠”在一起,但第二个侧边栏不能低于第一个侧边栏,除非侧边栏旁边的内容高于第一个侧边栏(怪异)解释,但我无法找出任何其他方式来解释它。)

它们都在2个不同的标签内,具有相同的ID:

#designsidebar {
float:right;
width:155px;
padding:10px;
border:solid;
border-width:1px;
border-color:#333330;
background-color:#171715;
margin-bottom: 10px;
border-radius: 10px;
}

3 个答案:

答案 0 :(得分:1)

您需要将它们都放在同一个标​​签中,然后将该标签浮动到右侧。此外,您在页面上的任何给定id都不应超过一个。

答案 1 :(得分:0)

您应该将id更改为class,因为您在同一页面上有多个background-color。您需要做的就是清除浮子。您还有两个border规范,因此我删除了最后一个,并将您的.designsidebar { float: right; clear: right; width: 155px; padding: 10px; border: 1px solid #333330; margin-bottom: 10px; border-radius: 10px; } 更改为速记css。

{{1}}

答案 2 :(得分:0)

首先,你不应该为2个不同的东西使用相同的id。出于某种原因,它被称为ID。你应该使用一个类。除了最佳做法,我不确定我是否理解了您的问题,但您可能需要将侧边栏设置为position:absolute;,并相应地设置z-index。使用javascript最有可能在符合条件时更改z-index。不确定标准是什么,很难说其他可能的方法。