2013-01-24 68 views
0

我正在創建一個調查問卷(我幾乎沒有編碼方面的專業知識),並且完全卡在IE中的styline中。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> 

回答

2

最簡單的方法(這是不是真的去了解這一點,備案的最好方式),將添加下面一行在你的CSS:

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

我選中此IE 9.0.8。

+0

感謝您的幫助!這固定的居中問題,但輸入框仍然重疊的文字區域在IE 8 – Daveth3Cat

+0

稍微工作,非常感謝! – Daveth3Cat