如何防止CSS溢出？

Question

我有这样的代码中CSS：

#top_bar { 
width: 100%; 
padding: 10px; 
border: 3px solid gray; 
/*margin: 0px;*/ 
margin-left: auto; 
margin-right: auto; 
position: fixed; 
bottom: 0px; 
} 

我碰上溢出有它的问题，我看不到我的状态栏的末尾（因为它是在页面的）。它没有显示滚动条（我不希望它），但我希望它完全打到页面的最后，而不是去查看它。
它正在右侧。

Answer 1

将填充关闭，此时宽度设置为100％+ 10px。然后，您可以将填充添加到#top_bar之内的容器，例如。

#top_bar .inner { 
    padding:10px; 
} 

<div id="top_bar"> 
    <div class="inner"> 
    ...Content... 
    </div> 
</div> 

或可替代地可以改变box-sizing迫使盒模型忽略计算宽度时填充：

#top_bar{ 
    box-sizing: border-box; 
    width: 100%; 
}