网站可以在Mac Safari，Firefox，Chrome上很好地预览，但只能在PC浏览器上显示正文

Question

During testing I'm having problems with the website displaying properly in PC browsers, including IE, Chrome and Firefox. It has tested well on Mac versions of Safari, Firefox and Chrome, however.

Specifically only the x-repeat background image in the body is displaying. All other content is not showing at all.

http://www.spmguardians.org/2013/index.html

Oddly, IE 10 previews the following page correctly, but not the page reference above:

http://www.spmguardians.org/2013/calendar/index.html

Any help would be greatly appreciated!

Answer 1

While the page loads fine for me (I'm using a MacBook Pro and Safari), I can see some syntax errors in your code.

<meta name="viewport" content="width=device-width, user-scalable=yes"></meta>

You should be closing the meta tag like this:

<meta name="viewport" content="width=device-width, user-scalable=yes" />

Additionally,

There are several of these lines under the #explore DIV...

    <div id="exploremenutop"> <a class="explore1" title="Guardian scores and schedules" a href="http://www.centralmassconference.org/g5-bin/client.cgi?G5genie=585">Guardian scores and schedules</a></div>
    <div id="exploremenutop"> <a class="explore2" title="Campus ministry, Grade 9 retreat" a href="PDFs/9th-Grade-Retreat-2017.pdf">Campus ministry, Grade 9 retreat</a></div>
    <div id="exploremenutop"> <a class="explore2" title="Parent Board News" a href="parentboard/index.html">Parent Board News</a></div>
    <div id="exploremenutop"> <a class="explore2" title="Alumni: Stay connected!" a href="alumninews/index.html">Alumni: Stay connected!</a></div>
    <div id="exploremenutop"> <a class="explore2" title="Student/Parent Handbook" a href="PDFs/Handbook2013-14.pdf">Student/Parent Handbook</a></div>
    <div id="exploremenutop"> <a class="explore2" title="College Contest for Juniors" a href="PDFs/CollegeVisitCompetition.pdf">College Contest for Juniors</a></div>

You are specifying the a twice... once at the beginning of the tag (where it belongs), and once again right before href. Remove the extra a floating out there in each of these lines.

Another one... this code:

      <!-- end #sidebar1 -->
  </span></div>

That closing span doesn't seem to close any actual tag. I can't find a matching opening span that goes with it.

Those are the errors that jump out at me... there may be more syntax errors, but going through and fixing little mistakes like this should help with rendering in more browsers. Each browser handles mistakes differently - some can work through them, some die, some just display your page wrong, etc.