IE7顯示問題（添加額外的頂部邊距）

我有一個非常艱難的時間搞清楚爲什麼IE7添加額外的填充到這個頁面！IE7顯示問題（添加額外的頂部邊距）

正確的頁面必須連接到上圖中的三個黑色標籤。這是它應該看起來如何：也存儲在imgur：64qbf.png （我只允許一個鏈接）

頁面鏈接可以在img中找到。（再次我只能發佈一個鏈接）

請幫忙！

CSS代碼：

<style type="text/css"> 
#background{ 
    background-image: url(/images/store/vaporIronBK.jpg); 
    background-repeat:no-repeat; 
    height:auto; 
    width:665px; 

    margin-top:125px; 

    margin-left:228px; 
    padding-top:5px; 
    font-size:15px; 
} 

#background a { 
    color: #ffffff; 
    text-decoration: none; 
} 

#background a:hover { 
    color: #de156d; 
} 

#videoLinks { 
    margin-top:52px; 
    height: 100px; 
} 

#buy{ 
    width:400px; 
    float:left; 
    clear:both; 
    padding-left:235px; 
    color:#000000; 
} 

#video { 
    float: right; 
    left: 683px; 
    margin-left: 35px; 
    margin-top: 166px; 
    width: 200px; 
    color: #000000; 
} 

#video a { 
    text-decoration: none; 
    color: #000000; 
} 

#video a:hover { 
    color: #de156d; 
} 

#footnotes { 
    color:#ffffff; 
    margin-top: 37px; 
} 

#bottom-text { 
    margin-left:40px; 
    margin-top:445px; 
    width:575px; 
} 

#bottom-text a { 
    color: #de156d; 
    text-decoration: none; 
} 

#bottom-text a:hover { 
    color: #000000; 
} 

#bottom-text p { 
    text-align: justify; 
} 

#bottom-text h2 { 
    font-size: 25px; 
    color: #000000; 
    padding-bottom: 10px; 
} 

#bottom-text h3 { 
    padding-bottom: 5px; 
} 

#bottom-text p { 
    padding-bottom: 20px; 
} 

#bottom-text .header-text { 
    padding-bottom: 25px; 
} 

#bottom-text p.taylor-image { 
    text-align: center; 
} 

.tabs { 
    height: 30px; 
    width: 180px; 
    float: left; 
    margin-left: 30px; 
    padding-top: 10px; 
} 
</style>

來源

2010-12-17 sahand

你需要包含一些示例代碼/ css /東西。我們無法從靜態圖像調試... – FatherStorm 2010-12-17 22:48:14

很難說實際上沒有一些代碼。至少爲該頁面的該部分添加CSS /屬性定義如何？還是你使用了一些所見即所得的編輯器，但不知道實際的HTML/CSS？ – Mario 2010-12-17 22:49:21

請發佈一些html和css。有了它，它就會像算命先生 – Fatih 2010-12-17 22:51:33

不知道，但嘗試了這一點在你的CSS做

body 
{ 
    padding:0; 
    margin:0; 
}

http://www.w3schools.com/css/css_margin.asp http://www.w3schools.com/css/css_padding.asp

或者希望看到別人發佈的一些代碼。

來源

2010-12-17 23:01:24 shaunhusain

。我也嘗試將它添加到這個頁面，但沒有運氣。 – sahand 2010-12-18 00:27:22

使用：

display: inline;

希望這有助於。

來源

2010-12-18 00:17:07 Adamski

我試圖添加內聯，它並沒有幫助:( – sahand 2010-12-18 00:27:50

好吧，如果你仍然無法找到解決方案，即有一個雙重保證金錯誤，閱讀關於CSS框模型或爲了方便使用條件像這樣：這段代碼的地方在文檔的頭部，，並且只有當您在指定的瀏覽器中時纔會使用此樣式表。並添加另一個樣式表只是爲了你有問題，並刪除額外的餘量或任何你遇到的問題希望這可以幫助 – Adamski 2010-12-18 00:55:26

嘗試從#background中刪除margin-top:，而是爲#background添加clear:both或clear:right。

來源

2010-12-18 18:36:19

我這樣做是爲了每一頁：

<body> 
<!--[if IE]><div class="ie"><![endif]--> 

...LALALA 

<!--[if IE]></div><![endif]--> 
</body>

這就是所謂的條件註釋。它是IE專有的，但對其他瀏覽器和驗證程序的評論類似。

現在您可以使用.ie祖先指定IE特定規則。

得到一些.ie #whatever {position：relative;}繼續，並把那些框放在他們應該是的地方！

來源

2011-11-23 14:39:07

一般來說，特別是對於IE7，但無論如何，爲了更好的實踐，總是指定所有雙方w /填充或邊距...換句話說不只是使用margin-top：？px（？for anything）並假設其餘的都很好。更好地使用保證金：？px 0 0 0或任何值。

另一個一般的想法，特別是在IE 7及以下版本中，不要在同一個元素上使用margin和padding。

此外，浮動的任何東西都需要一個寬度，而且對於雙重保證金的錯誤，它只發生在元素浮動的邊的同一邊上時......所以如果你聲明浮動：對某事而言，你不想擁有保證金：0 20px 0 0在同一件事上......它會變成一倍。最好在包含元素上使用填充。

來源

2012-01-29 12:49:05

IE7顯示問題（添加額外的頂部邊距）

回答

相關問題