2011-11-16 45 views
1

我已經爲我們的城市的網站建立了一個簡單的頁面。 Firefox和Chrome就像它很好...... IE將它打破。 我已經在W3School tryit編輯器中試過我的代碼,它在那裏出現。 頁地址爲: http://www.ci.douglasville.ga.us/index.aspx?NID=509爲什麼IE會打破我的頁面?

而這裏的違規代碼:

<table cellpadding="4" cellspacing="1" style="text-align: justify; width: 100%; " align="left"> 
<tbody> 
    <tr> 
     <td style="text-align: left; vertical-align: top; width: 350px; "> 
     <div style="text-align: center;"><span style="line-height: 17px; text-align: -webkit-auto; background-color: rgb(255, 255, 255); "></span></div> 
     <span style="line-height: 17px; background-color: rgb(255, 255, 255); "><b style="LINE-HEIGHT: 17px; BACKGROUND-COLOR: rgb(255,255,255)">ADULT KARATE 
     FOR ALL AGES &amp; SIZES!</b><br style="LINE-HEIGHT: 17px; BACKGROUND-COLOR: rgb(255,255,255)"> 
     <br> 
     This is the 
     chance you&rsquo;ve been waiting for to get healthy and more active!</span><br style="LINE-HEIGHT: 17px; BACKGROUND-COLOR: rgb(255,255,255)"> 
     <br style="LINE-HEIGHT: 17px; BACKGROUND-COLOR: rgb(255,255,255)"> 
     <span style="line-height: 17px; background-color: rgb(255, 255, 255); ">The McClure Style 
     of TaeKwonDo specializes in safe, affordable, quality training for all adults, 
     regardless of age, experience, or fitness level. All are welcome!</span><br style="LINE-HEIGHT: 17px; BACKGROUND-COLOR: rgb(255,255,255)"> 
     <br style="LINE-HEIGHT: 17px; BACKGROUND-COLOR: rgb(255,255,255)"> 
     <span style="line-height: 17px; background-color: rgb(255, 255, 255); ">Our Black-Belt 
     Instructors tailor all classes to meet your specific needs and skill 
     level:</span><span style="line-height: 17px; background-color: rgb(255, 255, 255); "> </span><span style="background-color: rgb(255, 255, 255); text-align: -webkit-auto; line-height: 17px; "> 
     </span></td> 
     <td style="border-top-style: solid; border-top-width: thin; border-top-color: rgb(44, 75, 129); border-right-style: solid; border-right-width: thin; border-right-color: rgb(44, 75, 129); border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: rgb(44, 75, 129); border-left-style: solid; border-left-width: thin; border-left-color: rgb(44, 75, 129); background-color: rgb(229, 225, 226); width: 205px; text-align: left; vertical-align: top; "> 
     <div style="text-align: left;"><span style="font-weight: bold; line-height: 17px; color: rgb(128, 104, 39); ">Contact</span></div> 
     <span style="line-height: 17px; background-color: rgb(229, 225, 226); "> 
     <span style="line-height: 17px; background-color: rgb(229, 225, 226); ">Tommy Nicholson, 
     Instructor<br> 
     <div>Ph: 
     770-942-0018<br> 
     <br> 
     Denver Thompson, Instructor<br> 
     770-595-1245</div> 
     </span> 
     <div class=""><br> 
     <b>Hunter Park Community Center</b></div> 
     </span><span style="line-height: 17px; text-align: left; "> 
     8830 Gurley Road<br> 
     Douglasville, Ga 30134<br> 
     To sign up call 770-920-3007<br> 
     </span></td> 
    </tr> 
    <tr> 
     <td style="text-align: left; vertical-align: top; " colspan="2"> 
     <ul> 
      <li><span style="line-height: 17px; ">Self-Defense Training</span></li> 
      <li><span style="line-height: 17px; ">Fitness, Flexibility, Coordination, &amp; Balance Training</span></li> 
      <li><span style="line-height: 17px; ">Rank Advancements at Your Own Pace</span></li> 
      <li><span style="line-height: 17px; ">Advanced Training in TaeKwonDo and Hapkido for Experienced Skill Levels</span></li> 
     </ul> 
     </td> 
    </tr> 
    <tr> 
     <td style="text-align: left; vertical-align: top; " colspan="2">&nbsp; 
     <table width="100%" cellpadding="2" cellspacing="1"> 
      <tbody> 
       <tr> 
        <td style="text-align: left;width: 280px; vertical-align: top; "><b>Adult Classes</b><br> 
        Registration: Every Tuesday (ongoing)<br> 
        <br> 
        Classes: Tuesdays, 7:30-8:30pm<br> 
        Cost: $50.00 per month<br> 
        <br> 
        </td> 
        <td style="width: 280px; text-align: left; vertical-align: top; "><b style="text-align: left; "></b><b>Karate for Kids</b><br> 
        Registration: Winter Classes begin Tuesday, <span class="Apple-tab-span" style="white-space: pre; ">   </span>November 15, 2011<br> 
        Classes: Tuesdays, 6:30-7:30 pm<br> 
        Cost: $60.00 per month for 8 week course<span style="text-align: -webkit-auto; "></span></td> 
       </tr> 
      </tbody> 
     </table> 
     </td> 
    </tr> 
</tbody> 

+0

你是什麼意思,打破它? IE中的菜單跳得比它應該低一點? –

+0

用適當的縮進來發現問題會容易得多。 –

+2

因爲microsoft製作了它,bro – CheeseConQueso

回答

2

您使用的是IE7的doctype,所以你的頁面與IE7的渲染引擎顯示。爲什麼不使用IE9的文檔類型,如:

<!DOCTYPE html> 

編輯:當然,你希望它在IE7中正確顯示,所以你還是要解決這個問題。在「兒童空手道」單元中,您有一個跨度爲white-space: pre;。這是造成你的問題。最簡單的解決方法是在它之前插入一個<br/>


這就是說,您的網頁使用了一些與網頁設計最佳做法相反的排版技巧。您正在使用表格來控制佈局和表示,這至少令人不敢恭維,但具有諷刺意味的是,您沒有使用表格來在頁面上顯示錶格數據。我還特別不鼓勵將頁腳城市標誌圖像分成兩半。

+0

底部表格是IE混雜的 –

+0

它全部採用Civic Plus專有的後端編輯器。我可以做代碼或wysiwyg。我製作了表格,然後在最後一個單元格中插入了一個較小的2單元格表格。鉻和火狐渲染罰款,而IE殺死它,然後傳播一切 –

+0

@NathanTodd - 最簡單的解決辦法是在'white-space:pre'之前的跨度前插入'
'。看到我更新的答案。 – gilly3

0

由於W3 Validator發現幾個問題,您應該認爲自己很幸運,只有IE瀏覽器不能正確顯示頁面。驗證程序還提供了有關可以解決問題的信息。

相關問題