我有这个CSS代码：

.topBar {
    width:100%; 
    height:70px;
    position:absolute;
    /*position:fixed;
    z-index:999;*/
    top:0; 
    left:0; 
    padding:10px;
    color:#000000;
    background-color:#eeeeee;
    border-bottom:2px solid #F36F25;
}

但因为它是100％宽并且有10px填充,它显示了一个水平滚动条.

我怎么能阻止这种情况发生但保持填充和100％宽度？

我试过了：

overflow-x: none;

在我的CSS中,但我仍然希望水平滚动条显示屏幕变得太小