0

我正在创建一份问卷(我几乎没有编码专业知识)并且完全被 IE 的风格所困扰。

Firefox 和 Chrome 都可以完美运行,但 Internet Explorer 不会将内容居中,输入字段也与文本区域重叠。

我知道这是一个提问的地方,没有太多的编码帮助,但我认为有人可能会注意到一些明显的错误并让我非常头疼!

<body>
<style type="text/css">
#wrap {
   width:800px;
   margin:0 auto;
   background-color:white;
   height:auto;
   margin-top:-16px;
}
#left_col {
   float:left;
   width:400px;
}
#right_col {
   float:right;
   width:400px;
}
body {
   background-image:url(questionnaire-background.png);
   font-family: calibri, verdana;}

</style>

<div id="wrap">
<center>
<br>
<h1>HR Newsletter Questionnaire</h1>
    <div>
    <p style="margin-top:20px">What is your name?</p><br>
    <p><input type="text" name="name" style="margin-bottom: 43px; margin-top:-46px; width: 50%"></p>
    </div>

    <div>
    <p>Is the HR Newsletter something you would like to receive?<p><br>
    <p><input type="text" name="like_to_receive" style="margin-bottom: 43px; margin-top:-46px; width: 50%"></p>
    </div>

    <div>
    <p>Comments:</p><br>
    <p><input type="textarea" name="comments" style="margin-bottom: 43px; margin-top:-46px; width: 50%"></textarea></p>
    </div>

    <div>
    <p>What do you like from the current HR Newsletters?</p><br>
    <p><input type="text" name="what_do_you_like" style="margin-bottom: 43px; margin-top:-46px; width: 50%"></p>
    </div>

    <div>
    <p>What do you do like or would like to be seen removed from the HR Newsletter?</p><br>
    <p><input type="text" name="not_like" style="margin-bottom: 43px; margin-top:-46px; width: 50%"></p>
    </div>

    <div> 
    <p>What would you like to be seen added to the HR Newsletter?</p><br>
    <p><input type="text" name="added" style="margin-bottom: 43px; margin-top:-46px; width: 50%"></p>
    </div>

    <div>
    <p style="margin-bottom:-22px">How often would you like to see the HR Newsletter?</p><br>
    <p>      
            <input type="radio" name="how_often" value="weekly">Weekly
            <input type="radio" name="how_often" value="fortnightly">Fortnightly
            <input type="radio" name="how_often" value="monthly">Monthly
            <input type="radio" name="how_often" value="quartely">Quarterly
            <input type="radio" name="how_often" value="yearly">Yearly<br></p>
    </div>

    <div>
    <p style="margin-top: 40px; margin-bottom:-22px">Would you prefer the HR Newsletter to see more of less of the following:</p><br>
    <p>
            <input type="radio" name="would_you_prefer" value="more_pictures">More pictures with less text
            <input type="radio" name="would_you_prefer" value="more_text">More text with less pictures
            <input type="radio" name="would_you_prefer" value="both">A balanced mixture of both<br></p>
    </div>

    <div>
    <p style="margin-top: 40px; margin-bottom:-22px">How long would you like the HR Newsletter to be?</p><br>
    <p>
            <input type="radio" name="how_long" value="9">Less than 9 pages 
            <input type="radio" name="how_long" value="10_15">10 – 15 Pages
            <input type="radio" name="how_long" value="15">15 + Pages<br></p>
    </div>
            <br><br><br><br>
    <div>
    <p><input type="submit" value="Send" style="margin-bottom: 43px; margin-top:-46px; width: 50%">
       <input type="reset" value="Clear" style="margin-bottom: 43px; margin-top:-46px; width: 50%"><br></p>
    </div>
</center>
    </div>
<body>
4

1 回答 1

2

最简单的解决方案(这实际上并不是最好的解决方法,为了记录)是在你的 CSS 中添加以下行:

body { text-align:center; margin:0px auto; }

我在 IE 9.0.8 中检查了这一点。

于 2013-01-24T18:32:43.410 回答