html - 由于 h1 标签,IE7 中的空间

标签 html css internet-explorer-7

在 IE7 中,问题和选项之间有一个额外的间距,但仅限于第一个问题。如果我删除 <h1>标题,差距消失。它不会发生在 IE8 中。是什么原因以及如何使其在 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

最佳答案

导致问题的是 float 。从 .questionText 的声明中删除 float:left

关于html - 由于 h1 标签,IE7 中的空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8784734/

相关文章:

javascript 在加载时执行标签

jquery - Opera 和 IE 中的 CSS 动画

css - 网站在除 IE7 以外的所有方面都运行良好,

html - CSS 下拉菜单在 Google Chrome 中无法正常工作(悬停时子菜单消失)

javascript - 取消/取消 IE7 输入搜索上的 JavaScript 操作

javascript - IE7 追加但注入(inject)时不加载 &lt;script&gt;

html - 我的 css 下拉菜单不会显示子菜单

javascript - JS - 无法读取 null 的属性 'setAttribute'

php - 在站点和断开的链接上启用 SSL

浏览器中的 Css 样式表,匿名用户