奇怪的白色空白和水平滾動問題

Question

看來我遇到了我正在處理的設計問題。我正在使用kickstart HTML框架，但我遇到了一些問題。

首先，我的頁面頂部（徽標，導航欄）和文本之間存在非常大的白色空白。

其次，我嘗試使用z-index將徽標覆蓋在導航欄上。但是它會導致負向水平滾動。我試圖通過隱藏overflow-x來隱藏它，但它似乎並不是最好的解決方案。

您可以在http://jkr.me.uk/problem.html

由於看問題，

約翰

Answer 1

使用的位置是：相對於上的標識使得它佔用的是你refferring空間。相反，使用float：right，或將其與position：absolute;放置在一起。

Answer 2

白色縫隙的問題是圖像。如果您禁用position:relative屬性，圖像底部將觸摸第一個標頭標籤的上邊距。對此的一個骯髒的修復將在徽標圖像上的第一個標頭上margin-top: -200px或margin-bottom: -200px。您也可以使用前一個回答者的方法。

至於標誌圖象重疊的導航欄，它爲我在Chrome和IE 9