100％寬度，填充和絕對定位

我試圖讓div填充屏幕的某個部分，左邊和右邊都剩下412px。很簡單，呃？100％寬度，填充和絕對定位

現在，當我添加位置：絕對&頂部：0，填充消失。元素檢查器顯示它爲空 - 「填充」保留，但寬度：100％消失。我用這個代碼（不定位）：

<div style="height:73px; padding-left:413px; padding-right:413px;"> 
    <div style="width:100%; height:73px; background:url(top-fill-small.png);"> 
    </div> 
</div>

所以，我怎麼能進行絕對定位它（我需要後來動畫），同時保留填充？我非常喜歡你的幫助。提前致謝！

來源

2011-02-05 Dwarf Vader

在你的HTML你不應該混合CSS：http://phrogz.net/css/HowToDevelopWithCSS.html#separatestyle – Phrogz 2011-02-05 20:02:59

謝謝，我知道了。這只是爲了寫作的速度。發佈時，我會將其分開。再次感謝您的關注！ – 2011-02-05 20:17:12

Perhaps this?

<div style="width:100%; position:absolute; top:0; left:0"> 
    <div style="height:73px; background:url(top-fill-small.png); margin-left:413px; margin-right:413px"></div> 
</div>

來源

2011-02-05 19:07:24 thirtydot

不是，因爲，正如我所說的，我需要它在左邊和右邊留下412px（在這種情況下）。這樣...只是嘗試一下，你會看到;）謝謝雖然:) – 2011-02-05 19:15:56

從你需要使用position:absolute;爲什麼不使用屬性left & right而不是填充的時刻？

HTML

<div style="height:73px;position:absolute;left:413px;right:413px;"><div style="width:100%; height:73px; background:url(top-fill-small.png);border:1px solid red">Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content </div></div>

例子：http://jsbin.com/anega3

編輯

的選擇，如果你急需的使用填充可以設置left:0; right:0;然後已經在使用墊襯你有。

HTML

<div style="height:73px;position:absolute;left:0;right:0px;padding-left:413px;padding-right:413px;"><div style="width:100%; height:73px; background:url(top-fill-small.png);border:1px solid red">Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content </div></div>

例子：http://jsbin.com/anega3/2

來源

2011-02-05 19:22:59 Sotiris

100％寬度，填充和絕對定位

回答

相關問題