Simple PHP site not working in IE9

HTML & CSS
1

Hi everyone,

A few years ago I made a very simple PHP website - easterncreekkarts.com.au

It has a simple MySQL database and uses PHP includes for reusable parts like the header and footer.

The website has hardly been updated since launch in 2007. But I started getting complaints from the client that none of the pages were working. I couldnt reproduce the problem until I just upgraded to IE9.

When you first open the website in IE9 the homepage loads fine, but clicking onto any other page (e.g. About) all fo the content is missing. Header, menu & footer still load, but the content which should appear between the menu and the footer is blank.

However, veiwing the source reveals the content is all there, and switching to ‘compatibility view’ fixes the issue.

I can’t figure it out, hoping someone else has encountered the issue and might be able to suggest a fix. It works in every browser except IE9.

Thanks

2

Its probably invalid HTML.

3

That’s what I originally thought, but i just ran several of the pages through the W3C validator and they all passed.

4

That’s interesting: I tried the same thing and it threw a big error, saying there was an encoding problem with the pages that prevented it from validating the pages at all. :frowning:

5

I think your site got HTML, JS or CSS problem, not PHP because PHP is the server side scripts.

6

There was a strange character in there which i removed (pasted from MS Word) but once removed everything validated perfectly but the problem still remains.

7

Thanks, i have posted it in the wrong section - moderator is going to move it to the html/css section.

8

When trying the validation on one of the pages i got:

  1. Mismatch between Public and System identifiers in the DOCTYPE declaration
    This document uses an inconsistent DOCTYPE declaration. The Public Identifier -//W3C//DTD XHTML 1.0 Transitional//EN declares the XHTML 1.0 Transitional document type, but the associated System Identifier http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd does not match this document type.
    The recommended System Identifier for XHTML 1.0 Transitional is http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd.
    The safest way to use a correct DOCTYPE declaration is to copy and paste one from the recommended list and avoid editing that part of your markup by hand.

The page displays ok for be (FF 3.6.17) maybe IE9 is less forgiving. Is IE9 displaying it in “quirks mode”?

9

Yes i saw that, it was only a warning. I’ve fixed it now for the ‘about’ page only but it didn’t solve the problem with IE9 not displaying. According the W3C the about page is 100% valid

10

OK, thread moved to the HTML forum. Looks like it might be worth replacing the doctype, even if that’s not the problem.

11

I think the problem is in your css file screen.css:


#content {
    font-size: 12px;
    margin: 0 auto;
    overflow: hidden;
    padding-top: 5px;
}

Please try to remove the overflow: hidden; and let me know how the result.

12

Overflow hidden without a height…
bit.ly/ih9fcy Sorry about the size of the image…

13

Mitcho, in your screen.css you have a body {line-height:130%;} statement. If I change the line-height to anything less than 130% (even 129%) then it works okay in IE9. Try changing that value and see if it helps you.
Don’t ask me why???:confused:

14

Well spotted! That does work, but it sure is weird. :confused:

15

Big big thank you to thietkeweb and logic_earth - removing the overflow:hidden fixed it!!

16

You’re welcome mitcho, i’m please to share what I know. :slight_smile: