由於h1標記，IE7中的空間

在IE7中，在問題和選項之間創建了一個額外的間距，但僅限於第一個問題。如果我刪除<h1>標題，差距就會消失。它不會發生在IE8中。原因是什麼以及如何使其在IE7中工作？由於h1標記，IE7中的空間

<!DOCTYPE HTML> 
<html> 
<head> 
    <style type="text/css"> 
     .question { padding-bottom: 25px; } 
     .questionNumber { width:30px; float:left; } 
     .questionText { float:left; margin-bottom:5px; } 
     .options { clear:both; margin-left:30px; } 
    </style> 
</head> 

<body> 
    <h1>Survey</h1> <!-- if this line is removed, the gap disappears --> 
    <div class="question"> 
     <div class="questionNumber">1)</div> 
     <div class="questionText">Question 1:</div> 
     <div class="options"> 
      <input type="radio">Option 1 <br> 
      <input type="radio">Option 2 <br> 
      <input type="radio">Option 3 <br> 
      <input type="radio">Option 4 <br> 
     </div> 
    </div> 

    <div class="question"> 
     <div class="questionNumber">2)</div> 
     <div class="questionText">Question 2:</div> 
     <div class="options"> 
      <input type="radio">Option 1 <br> 
      <input type="radio">Option 2 <br> 
      <input type="radio">Option 3 <br> 
      <input type="radio">Option 4 <br> 
     </div> 
    </div> 

</body> 
</html>

enter image description here

來源

2012-01-09 ananda

這是浮動，導致問題。從.questionText的聲明中刪除float:left。

來源

2012-01-09 07:33:07

我明白了，這可能是一個更準確的答案。我應該把它看作是IE7的bug嗎？如果我想在那裏使用'float：right'會怎麼樣？ – ananda 2012-01-10 01:50:57

重置對H1的風格，它可能的line-height向下推。

h1 { 
line-height:0; 
margin:0; 
padding:0; 
}

我建議使用重置樣式表，因爲它會爲你節省調試頭痛的道路

http://meyerweb.com/eric/tools/css/reset/

來源

2012-01-09 06:43:18

把這個風格：

h1{ 
margin:0; 
padding:0; 
}

注：你正在使用html5 DOCTYPE。 HTML5不支持較低版本即。

來源

2012-01-09 06:44:27 anglimasS

HTML5文檔類型在這裏是無關緊要的。 – BoltClock 2012-01-09 06:55:31

好吧，這是保證金（具體來說，保證金底部）。必須將margin設置爲0，並使用間距填充。這適用於我的情況，但出於好奇，如果我因任何原因無法將邊距設置爲0，我該怎麼辦？按照另一篇文章中的建議，嘗試了一些行高，但似乎並不奏效。 – ananda 2012-01-09 06:58:27

重置h1上的樣式。就像這樣

h1 { 
    padding: 0; 
    margin: 0; 
    display: block; 
    clear: both; 
}

我認爲這可能對您有所幫助。去嘗試一下。

來源

2012-01-09 06:55:30 NewUser

當你說線高：0，我應該真的把它設置爲0，或者我可以設置一些其他值？設置爲0真的搞砸了佈局。我錯過了什麼嗎？ – ananda 2012-01-09 07:03:49

只是刪除行高：0並檢查它。其他的東西都是一樣的。 – NewUser 2012-01-09 07:08:43

由於h1標記，IE7中的空間

回答

相關問題