Internet Explorer CSS問題。（隱藏的填充）

Question

我使用jQuery UI創建了一個小滑塊，它完全可以在Firefox中正常運行。 但是，在IE中，似乎在對象之間放置了填充。 看看，您會看到：

http：//www.grant [deletethis] unwin.co.uk/slider/slider1.html

我了解不同的瀏覽器會自動設置不同的頁邊距和填充，因此我嘗試使用：

* {
    padding: 0px;
    margin: 0px;
}

但是問題仍然存在。

問題：

如何消除滑塊上的圖片之間的間隙（在IE中）？

Answer 1

您的頁面正在以Quirks模式呈現，因為您沒有使用doctype （..將觸發標准模式）。

您的第一行當前是這樣的：

<html>

在第一行添加一個doctype，例如HTML5 doctype：

<!DOCTYPE html>

它將神奇地修復。

Answer 2

請添加有效的Doctype，因為您的網站正在IE中以Quirks模式進行查看。

<!DOCTYPE html>
<html> .... </html>

額外的
刪除img元素本身的float並設置display: block;

.scroller_item {
    float: left;
    height: 238px;
    width: 192px;
}

.scroller_item .image {
    display: block;
    height: 238px;
    width: 192px;
}

Answer 3

我建議使用重置將所有瀏覽器中的所有樣式都歸零。 使用它應該可以解決您的問題。 埃里克·梅耶（Eric Meyer）的重置

Answer 4

嘗試添加：

*
{
  padding: 0px;
  margin: 0px;
  border: none;
}

#sliding_section
{
  overflow: auto;
}

您必須調整*屬性，因為這對生產站點不利，但可能會起作用。

Answer 5

嘗試在CSS類的“ .scroller_item .image”定義中刪除“ float：left”。

Internet Explorer CSS問題。（隱藏的填充）

問題描述

5 個解決方案

解決方案1
4 已采納 2011-04-14 20:15:40

解決方案2
1 2011-04-14 20:15:17

解決方案3
1 2011-04-14 20:16:10

解決方案4
0 2011-04-14 20:14:29

解決方案5
0 2011-04-14 20:30:01

Internet Explorer CSS問題。 （隱藏的填充）

問題描述

5 個解決方案

解決方案1 4 已采納 2011-04-14 20:15:40

解決方案2 1 2011-04-14 20:15:17

解決方案3 1 2011-04-14 20:16:10

解決方案4 0 2011-04-14 20:14:29

解決方案5 0 2011-04-14 20:30:01

Internet Explorer CSS問題。（隱藏的填充）

解決方案1
4 已采納 2011-04-14 20:15:40

解決方案2
1 2011-04-14 20:15:17

解決方案3
1 2011-04-14 20:16:10

解決方案4
0 2011-04-14 20:14:29

解決方案5
0 2011-04-14 20:30:01