在p-tag中填充半透明圖像覆蓋

Question

我在div中有一個img，我需要覆蓋需要填充的文本塊。

外部的div標籤有溢出：隱藏，因爲圖像需要裁剪到最大高度。

如果你看一下我的小提琴

http://jsfiddle.net/Py49n/1/

你會看到P標籤內的文本被寫入到遠的權利，因爲對標籤有100％的寬度+填充。

如何在不使p標籤更寬的情況下實現文本邊距？將大小

感謝所有幫助

Answer 1

使用box-sizing: border-box（和適當的前綴），以允許框包括填充。更多關於CSS-Tricks的信息。瀏覽器支持是pretty good。如果你需要支持IE7，你需要另一種解決方案，也許是一個polyfill。