無法正確浮動谷歌plusone按鈕，並使其工作

我有一個包含Facebook的按鈕，谷歌plusone和電子郵件按鈕的股利。我已經浮動與浮動div：正確，但谷歌plusone不再可點擊。 Facebook按鈕可在整個按鈕的2/3處進行點擊。無法正確浮動谷歌plusone按鈕，並使其工作

當我從類BookContain中刪除float：right時，它工作正常（僅在左邊）。我嘗試刪除浮動：正確，並用相對定位替換它，但Google plusone又不喜歡它。

下面是一個例子... http://www.giftsthatthrill.com.au/gifts/skydiving-experiences/Coolum_Beach/AD9788

該塊的CSS是

.bookcontain { 
margin-top:5px; 
float:right; 
} 
.bookcontain ul { 
text-align:left; 
list-style:none; 
margin:0; 
padding:0; 
} 
.bookcontain ul li{ 
text-align:left; 
display:inline-block; 
padding:0 2px 2px 0; 
margin:0 0 0 5px; 

} 
.bookcontain ul li.google { 
vertical-align:top; 

}

我還發現，火狐顯示該塊中的谷歌Plusone精選低......這可能是相關的到上面的問題。

任何想法將不勝感激！

來源

2012-05-24 Phil Williams

這些按鈕不可點擊，因爲它們被選項卡div隱藏。

這裏是一個快速的解決辦法...

添加這個CSS來放置上面的標籤DIV的按鈕：

#socialBookMarks{ 
    position: relative; 
    z-index: 9; 
}

這將拉昇了Google+按鈕：

.google{ 
    position: relative; 
    top: -13px; 
}

我將很快更新與CSS來修復按鈕的位置...

來源

2012-05-24 04:07:56 user1160232

啊......這非常有幫助。 Z指數做到了。只需檢查Google+按鈕位置即可，因爲FF和IE正在做不同的事情。 –

我無法讓Google按鈕向上移動。我試過了： .google { \t top：-13px; \t \t top：0px \ 9; } 有和沒有黑客。 –

通過將高度：20px添加到包含div來找到解決方案。非常感謝您在獲取Z-index時的幫助......這已經是幾個星期的問題......現在已經解決了。 –

在文件中進行以下更改。

地點<div style="clear:both;"></div>socialBookMarks之後關閉分割。

從CSS5.css行數22

刪除vertical-align: top;這些變化將會使你的按鈕留在右邊，點擊和正確對齊。

來源

2012-05-24 04:01:50 Libin

非常感謝里賓...問題已經表明了它如果由於z-index隱藏div。增加z-index將div帶到前面，因此它變得可點擊。我現在遇到的問題是讓FF顯示GooglePlus一致。 –

還注意到您的標籤和內容之間存在差距。通過從第22行刪除'vertical-align：top;'將會修復它，但會混淆內部的內容。 – Libin

你說得對。刪除線22修復了它，但刪除會影響很多頁面，包括內部內容。我會繼續尋找解決方法。 –

無法正確浮動谷歌plusone按鈕，並使其工作

回答

相關問題