3

这个问题可能有一个简单的解决方案。

我设计了一个并排有两列的网站。除了右栏外，一切都是固定的（菜单栏和左栏）。

这是故意的，因为我只希望右栏滚动，它会保存页面的可读内容。所以一切都很好，对吧？

不完全是，左列是向左浮动的，而右列也以足够大的左边距浮动，以允许在加载时正确地坐在页面中。

但是，当屏幕水平太小时，用户可以左右滚动并移动第二列，甚至在我固定的第一列下方。这就是我想要阻止的。

如何让第二列垂直滚动但不水平移动？

这是css的一个片段：

#main-content {float: left; margin: 100px 0 0 0; background: rgba(128,127,128,0.9); padding: 15px 25px 15px 15px; width: 500px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}
#button-glue {float: left; position: fixed; padding: 0 25px 15px 0px; width: 525px;}
#button{
    float:right; margin: 5px -20px 0 0;
}
#button a {
    background:url(../images/button.png) 
    no-repeat;
    display:block; /* Necessary, since A is not a block element */
    width: 167px;
    height: 58px; 
}
#button a:hover {
    background:url(../images/buttonhover.png) no-repeat;
    width:167px;
    height:58px;
}
.right {float:right; margin: 0 0 5px 25px;}
#secondary-content {float: right; margin: 100px 0 15px 569px; background: rgba(128,127,128,0.9); padding: 20px; background: rgba(128,127,128,0.9); width:405px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;}

谢谢！

4

2 回答 2

13 
overflow-x:hidden

这将不允许元素上的滚动条并隐藏任何悬垂的东西。

于 2012-11-13T20:41:26.850 回答
0

我希望我能正确理解你的问题，但为什么你可能不需要使用浮点数。

Float 是将元素向左或向右推，我认为它非常方便，但对于您的解决方案，您不需要它。相反，您可以在您的次要内容 div 位置上使用：absolute。而不是使用边距，使用顶部，左侧更容易。因此，如果您想将次要内容 div 放在正确的位置，您可以使用：

position: absolute;
top: 100px;
left: 569px;

我建议您对其他元素执行相同的操作，并使用边距在元素周围创建空间。

于 2012-11-13T21:01:39.913 回答