當設置填充時div擴展到另一個div

Question

當我爲div .detalhes設置填充時，.detalhes框擴展到div .seta。看一看： http://jsfiddle.net/XdfCp/

我能做些什麼來解決這個問題？我的detalhes div有100％的智慧。我希望它考慮填充來計算所需的寬度。

Answer 1

取出寬度，並且不浮動的股利。 http://jsfiddle.net/XdfCp/3/

#ListaEventosPorMes .detalhes{ 
    display: block; 
    background-color: #722827;   
    text-align: left; 
    padding: 10px; 
} 

如果你正在學習CSS，需要一些時間來了解彩車工作，並儘量避免他們，當有替代品。不要只是浮動一個元素來「修補」某些東西，這可能會帶來不好的後果。

Answer 2

這是因爲您添加了填充的元素的寬度設置爲100％，這意味着填充將添加到此元素上，從而將元素擴展到.seta。最好的辦法是改變你的寬度，並將填充設置爲％，如寬度：90％;填充：5％或設置最大寬度。

是這樣的：http://jsfiddle.net/XdfCp/2/