IE 8 display anomaly

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

IE 8 display anomaly

Post by califdon »

I know, what else is new? But this one has me stumped. I'm trying to write a web page that displays posted comments, like a simple blog, using PHP and MySQL. It works fine in all browsers except IE (IE8, specifically), where it fails to display most of the elements of each post, showing only the body of the message, despite the fact that all the lines are there in the source page. I can't see any reason that it's not displaying the sender, subject, date, etc. To try to isolate the problem, I made a simple HTML page simulating the output from PHP -- and it does the same thing! I have the HTML page on my personal server: http://ravey.net/test/testie8.html. View it in Firefox or Opera or Chrome or Safari (ignore the misalignments, that happened when I took out the PHP and messed up something else), you'll see that each post has an author, a reply button, a subject, and a datetime, in addition to the message body (don't try the pagination, since I've removed the PHP, but it works fine). Now view the same page with IE 8, and there's no author, no reply button, no subject, no datetime--just the message bodies. But if you look at the source page, it's all there! I've gone over my <div>s a dozen times and I can't find anything unusual about some of the fields, but not others. Does anyone see what's causing this?
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Re: IE 8 display anomaly

Post by Benjamin »

If you run it through a validator you can get some good clues.

http://validator.w3.org/check?uri=http% ... ne&group=0
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: IE 8 display anomaly

Post by Celauran »

You haven't declared a doc type, so IE is rendering the page in quirks mode. Adding <!DOCTYPE html> made the page render exactly like Chrome.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: IE 8 display anomaly

Post by califdon »

Wow! Originally I had the DocType correct (an earlier printout has it right), but at some point I remember I did some copying/pasting and I do remember retyping the DocType line, but in the process, by force of habit, I used html block comments tag syntax instead of the DocType syntax! Many thanks!!

And thanks, Benjamin, for reminding me to validate my html! Good advice that I shouldn't need to be reminded of, but thanks for doing so.

Don
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Re: IE 8 display anomaly

Post by Benjamin »

Honestly I really don't care too much about validation because I don't agree with some of the things that fail validation, but it is good to find errors occasionally.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: IE 8 display anomaly

Post by califdon »

Right. But you know what frosts me is that, apparently, when IE doesn't recognize the DocType, its quirks mode doesn't do anything that I would expect, it picks 4 out of 5 <div> tags to completely ignore, but renders the 5th one just fine! And does it for each succeeding group of <div>s! Who knew?! Of course, the other thing is that I completely ignored the DocType, which looked so familiar ( <!-- instead of just <!, and similarly on the closing tag ) that I was blind to the error.
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Re: IE 8 display anomaly

Post by Benjamin »

IE Probably interpreted that as an opening comment and was never able to find the closing comment.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: IE 8 display anomaly

Post by califdon »

Benjamin wrote:IE Probably interpreted that as an opening comment and was never able to find the closing comment.
The closing comment tag was actually there (at least I was consistent!), but I still can't figure out why IE picked out just certain <div>s and not others, to hide. I'll take a closer look at my div CSS, it must be something about my styling that caused it.
User avatar
Celauran
Moderator
Posts: 6427
Joined: Tue Nov 09, 2010 2:39 pm
Location: Montreal, Canada

Re: IE 8 display anomaly

Post by Celauran »

It wasn't ignoring the divs as such, it can't handle floats in quirks mode. Disable the float rules and the divs display fine.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: IE 8 display anomaly

Post by califdon »

Celauran wrote:It wasn't ignoring the divs as such, it can't handle floats in quirks mode. Disable the float rules and the divs display fine.
Ahh! Thanks, that makes sense (at least to Microsoft).
Post Reply