2010-04-27 83 views
2

我對此頁面有問題http://www.gwynfryncottages.com/news.php明確的問題:正確;

.blog-footer div需要在右側清除以糾正圖片的高度,並引入clear:right;導致FF和IE頁面上出現巨大的差距。

我不知所措,我已經試過無數的想法來解決這個問題,在這一點上我一直盯着它太長清楚地看到這個問題。誰能幫我嗎。

在此先感謝。

+0

一個完全不方便的解決方法是將頁面的內容浮動到左側,而不是將側欄浮動到右側。 – MrHen 2010-04-27 19:33:10

+0

此外(雖然不一定是解決方案)編碼它,以便側邊欄後的內容,然後漂浮權可能有更少的影響conent。 – Jamie 2010-04-27 19:35:28

回答

0

嘗試使用的定位。加入這些讓你開始:

#page-body {position: relative; width: 740px; margin-left: 20px;} 
#sidebar {position: absolute; right:-190px;} 

有一些細微之處,如獲得正確的行爲時,將內容作爲一個整體是不是足夠長的時間來推動頁腳下來,但我覺得那些更容易比浮動摸出問題。使用像您一樣的固定高度頁腳,使用頁面底部的底部邊距和頁腳的更多絕對位置很容易修復。你有gobs和額外的div的gobs可以玩。

0

clear屬性適用於相對於浮動元素。因此,您可以使用它來確保頁腳關閉圖片下方的div,但側欄懸浮的事實實際上會將內容推到側欄的底部。

所以,@Nicholas威爾遜提出,一種解決方案是使用比浮動等手段來定位你的側邊欄。而且你的佈局似乎並不需要浮動邊欄。

在另一個方向,我注意到,您目前硬編碼您的圖片的高度。既然你知道這些高度,另一種可能是忘記clear:right的博客,頁腳,和min-height屬性添加到資產體,如(這是啤酒節)

<div class="asset-body" style="min-height:184px;"> 

當然不優雅或幹,但如果你不得不這樣做,或讓JavaScript做到這一點。