Css 溢出：自动导致滚动条/滚动条显示在Safari中

我有一个容器div（#columnsOne），设置为920px+38px padding+2px border，总宽度为960px

（#columnsOne）使用CSS“overflow:auto；”垂直扩展并包含其中的所有内容

这在所有浏览器上都可以垂直扩展div，在Firefox、Chrome和IE7/8上也可以正确显示水平宽度。然而，在Safari上，会出现一个水平滚动条，并向右滚动约600px的空白空间

起初我认为我的边距/填充设置可能错误，这就是为什么它可能扩展正确，但我不可能有600px的额外空间

有没有想过为什么会发生这种情况

屏幕截图（新用户，因此我无法在此发布）：

许多编辑试图在这里获取代码，新手，对不起

 <div class="columnsOne">

        <div class="sectionLeft">

            image/name of giveaway are here

        </div>

        <div class="sectionRight">

          sign in form here

        </div>

    </div>


#columnsOne, .columnsOne {
clear: both;
width: 958px;
margin-right: auto;
margin-left: auto;
margin-top: 10px;
margin-bottom: 20px;
background-color: #FFFFFF;
height: auto;
border: 1px solid #77787b;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
padding: none;
overflow: auto;
}   


#columnsOne .sectionLeft, .columnsOne .sectionLeft {
float: left;
height: auto;
width: 590px;
background-color: #FFFFFF;
overflow: auto;
margin-top: 0px;
margin-right: 20px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 19px;
padding-right: 19px;
padding-bottom: 19px;
padding-left: 19px;
}

#columnsOne .sectionRight, .columnsOne .sectionRight {
height: auto;
width: 270px
padding: 0px;
margin: 0px;
overflow: auto;
padding-top: 19px;
padding-right: 19px;
padding-bottom: 19px;
padding-left: 19px;
}

这里有赠品的图片/名称
在这里签名
#columnsOne，.columnsOne{
明确：两者皆有；
宽度：958px；
右边距：自动；
左边距：自动；
边缘顶部：10px；
边缘底部：20px；
背景色：#FFFFFF；
高度：自动；
边框：1px实心#77787b；
边界半径：10px；
-moz边界半径：10px；
-webkit边界半径：10px；
填充：无；
溢出：自动；
}   
#columnsOne.sectionLeft、.columnsOne.sectionLeft{
浮动：左；
高度：自动；
宽度：590px；
背景色：#FFFFFF；
溢出：自动；
边际上限：0px；
右边距：20px；
边缘底部：0px；
左边距：0px；
填充顶部：19px；
右侧填充：19px；
垫底：19px；
左侧填充：19px；
}
#columnsOne.sectionRight、.columnsOne.sectionRight{
高度：自动；
宽度：270px
填充：0px；
边际：0px；
溢出：自动；
填充顶部：19px；
右侧填充：19px；
垫底：19px；
左侧填充：19px；
}
我不确定
溢出：自动
是这里使用的正确解决方案-您可能希望了解浮动以及它们如何控制文档流

但是，我确实注意到，当
.sectionright
上禁用width属性时，多余的空间将消失。
您可以设置
溢出-x:hidden溢出后自动，至少在safari上会应用该规则。
Chrome和safari图片看起来很相似。我们需要查看HTML的大元素，溢出：当内容溢出到容器大小时，自动将添加一个滚动条。它们完全相同，只是safari中有一个滚动条，而不是Chrome（或Firefox或IE）.我知道如果内容溢出，应该添加滚动条，但是，内容不会溢出，特别是不是600px左右，这就是Safari在右侧添加的额外空间…确实有效，谢谢。我现在将使用它作为解决方案，我只是不明白为什么它的原始代码可以在所有浏览器中工作，除了Safari。如对于浮动：在本例中，我希望白色的背景色覆盖整个背景，我已经阅读了数小时的主题，除了在（#腹部）底部放置一个空白div之外，我还没有读过任何其他的方法。我想多读一些，你有没有关于这个主题的好的阅读来源？**编辑：不习惯按“返回”来提交表单，对不起！“这很好，谢谢。我仍然不明白为什么它会出现在Safari，而不是其他地方，但在我学会之前，这似乎是一个很好的解决方案。@Billy我不能+1这个就够了。谢谢Billy，你的回答真的帮了我大忙。”。