如何中心和元素的內容，同時有背景100％

Question

我想設置一個佈局，其中的內容（可以是文本或任何東西），在中間，而背景顏色或圖像是在整個寬度。我的解決方案是創建一個元素容器與背景和一個較小的寬度的子元素和margin: 0 auto;

（http://jsfiddle.net/kp4D8/1/）。

有沒有其他人想出了另一種解決方案，就像這樣更簡單？

感謝， 卡西姆

Answer 1

你的方法是你如何去這樣做，它可能是最好的辦法。

，如果你想用最少的標記，你可以儘管使用一種替代方法是切出<section>元素，只是應用margin到元素.element-container下是這樣的：

jsFiddle

.element-container * { 
    padding: 5px; 
    width: 50%; 
    text-align: justify; 
    margin: 0 auto; 
} 

.element-container h2 { 
    text-align: right; 
} 

的我寧願選擇原始方法的原因是我可以更輕鬆地設計內部元素的背景，並且可以在不使用*選擇器的情況下一起整理所有樣式。