2010-01-22 104 views
1

我的粘性頁腳在所有瀏覽器中效果很好,期望Safari & Chrome,特別是work.html頁面本身。Safari和Chrome中的Stick Footer問題

http://obliqueinteractive.com/creative/work.html

,我注意到當我從我的樣式表中刪除這個CSS屬性,問題消失,但不允許頁腳再堅持

html, body {height: 100%;} 

難道還有其他的CSS問題強迫頁腳以這種方式行事?

+0

我沒有看到在Firefox中呈現什麼區別和Safari中的渲染。小心解釋應該發生什麼以及實際發生了什麼? – zneak 2010-01-22 05:56:56

回答

1

首先,很難診斷沒有看到您的代碼。是的,肯定還有其他可以影響粘性頁腳的CSS問題;即填充其他元素。同樣,很難診斷我們何時無法看到您的代碼。

This stickey footer很棒,我用了很多。對於粘頁腳和的div填充

+0

在谷歌,頁腳似乎被擠在一個divs – BlazeK 2010-01-22 07:20:17

1

代碼:

body{ 
background-image: url(../images/main_bg.jpg); 
background-repeat: repeat-x; 
} 
#wrapper{ 
width: 961px; 
margin: 0 auto; 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -104px; 
} 
.footer, .push { 
height: 104px; 
} 
#work_colm{ 
width: 675px; 
float: left; 
display: inline; 
padding-bottom: 40px; 
} 
#footer { 
margin: 0 auto; 
background: #292929 repeat-x; 
height: 104px; 
clear: both; 
} 
+0

嘿,謝謝你!設置.push div的高度對我來說是個訣竅。其他解決方案將在那裏放置一個「清晰:兩個」,但IE7和Chrome只能在.push上設置高度與.footer相同的高度後才能工作。 – 2012-05-16 05:14:55

-2

我做(向浮動頁腳元)以下的變化,現在可在Safari,歌劇,火狐和Chrome。

width: 101%; 
margin-left: -8px; 

我不知道,如果加上了8px只是爲我修復或全部修復,但給它一個鏡頭,讓我知道