Why are pieces of my HTML showing up on the page and breaking it? Is it PHP related?

+2 A:

PHP will never produce any differences across browsers (unless you work at making it do so). It's compiled serverside, so the only thing that the browser sees is the the HTML/CSS/Javascript.

JGB146 2010-03-25 15:08:18

Right, I'm just wondering if the way the PHP is producing the HTML/CSS is causing some quirk being picked up in my client's experience that I'm not picking up in mine, maybe? If not, do you have ideas on what could cause this otherwise? Thanks so much.

Jason Rhodes 2010-03-25 15:12:25

Browsers handle badly formed HTML differently. Some will try to guess what the HTML should be and look somewhat reasonable while others will just blow the heck up.

abeger 2010-03-25 15:16:24

It's definitely a quirk about the HTML you're producing, having little to do with the fact that it's done in PHP. Could you post the client-side view of the HTML so we can see what is actually being given to the browser?

JGB146 2010-03-25 15:16:51

Sure, I'll add the HTML source to the bottom of the question right now.

Jason Rhodes 2010-03-25 15:23:34

Damn I think I see a huge problem right now -- the closing `</li>` tag is left off of the 3rd level nav elements.

Jason Rhodes 2010-03-25 15:36:37

One could be picky and say: "No, if you output different stuff regarding the "User-Agent" header, PHP will output different stuff across browsers". Good thing I'm not that picky. :P

Malax 2010-03-25 15:37:29

That's not a huge problem, exactly, but it very well may be what's causing this. It's possible that it's not being left off, but rather is not being output in the place you think. Then when it does get output, the location doesn't make sense, resulting in the </li> you see for browsers that don't ignore the mistake.

JGB146 2010-03-25 15:39:56

A:

You absolutely need to generate valid HTML with a proper DOCTYPE to be rendered by browsers in standards mode. When you don't, browsers try to fix the errors they find the best of their ability. While there's (supposedly) only one standard way to display valid HTML, there're no rules to handle invalid HTML because the variety of possible errors is infinite. Broken HTML (aka tag soup) is subject to way more cross-browser differences.

Now, the mere fact that you've included PHP as first suspect suggests that you don't have a clear idea of how web technologies work and interact. It's alright (we all have to start learning somewhere) but you should know that PHP is a server-side language. It can generate HTML (and CSS, JavaScript or even pictures) but browser only receive its output. When your page looks bad, resort to your browser's View Source menu as your first debugging tool.

Update

You can use this: http://validator.w3.org/#validate_by_input

Your HTML triggers 55 errors (however, it's likely that they all have the same source). It's also a good idea to validate CSS.

Álvaro G. Vicario 2010-03-25 15:36:51

I really appreciate everyone's help. I only asked if it's PHP-related because I know that sometimes the way the PHP is written (ie echo vs inline etc) can have an effect on the HTML output. // As for DOCTYPE, I'm currently making every effort to use HTML5, which is <!DOCTYPE HTML>, so that's why you see what you see.

Jason Rhodes 2010-03-25 15:40:53

That's not true: the only effect on HTML comes from the code itself. Using echo $foo, print $foo or <?=$foo?> is not relevant; how could it?

Álvaro G. Vicario 2010-03-25 15:51:54

So your answer is, "I don't think it's PHP-related." Thanks!

Jason Rhodes 2010-03-25 15:54:53

Jason Rhodes 2010-03-25 16:11:51

You *can* have

Álvaro G. Vicario 2010-03-25 16:13:51

Jason Rhodes 2010-03-25 16:41:51

There's HTML markup and CSS layout. You can make your <span> look the way you want (display: block). Whatever, <ul><li>foo<div>a</div></li></ul> validates for me.

Álvaro G. Vicario 2010-03-25 17:00:55

A:

Looking at the html you are missing the "<html>" tag in the header it should appear right after the doctype. I would imagine that that's important in preventing parsing errors.

Like Alvaro suggested, you need to make sure it's valid for the best cross browser compatibility.

Use W3C's validator: http://validator.w3.org/ to validate your html

KThompson 2010-03-25 15:41:06

KThompson, which tag is missing? It may have disappeared without the `` marks.

Jason Rhodes 2010-03-25 15:45:54

Literally the "<html>" tag. The doc should start with <html> and end with </html>

KThompson 2010-03-25 18:55:05

A:

I validated your HTML, and only three things came up: You have two links with spaces in them: <li><a class='title' href='http://28.5.337.28/~habiall2/?page=construction volunteer'>Volunteer</a><li> and <li><a href='http://28.5.337.28/~habiall2/?page=non-construction volunteer'>Non-Construction </a>

and somewhere you used an ampersand instead of & which is minor, but I suppose could be causing the problem. I also can't get the page to render incorrectly in Chromium or Firefox, but then I don't have CSS or JS. Is it possible one of you Javascript deals is gumming up the works? Try removing all your JS and see if the error is still there.

stillinbeta 2010-03-25 15:55:44

ansaurus

tags:

views:

answers:

Why are pieces of my HTML showing up on the page and breaking it? Is it PHP related?

Update

related questions