Web Page displays HUGE differences in different browsers

[laurasamps]

Hi guys. I know when building a website there will be small differences between how it displays on different browsers, which sometimes matter and sometimes don't, however, I'm finding that in Firefox everything is displayed correctly, but in Opera and IE the whole left side is shifted to the right, I'm talking all the way across the screen, and my videos don't play. Any ideas?

Cheers

[laurasamps]

sorry i should also say im using Dreamweaver CS5 and a template that until adding a small iframe worked beautifully (apart from the video part)

[rocknbil]

Validate [validator.w3.org]?

[laurasamps]

Thanks I'll get it online and give it a go. Thanks

[jbinbpt]

Sounds like a broken div

[laurasamps]

how would i fix a broken div? thanks

[jbinbpt]

Are you able to remove the iframe and get the page to render properly? If so what happens when you reintroduce the iframe?

Div's come in pairs <div> bal bla bla </div>. Look for a pair that is not a set. Note...div's nest. You will have divs inside of divs.

[rocknbil]

Validation would fix that. A way to work is, let's say you have something like

<div> 
 <div> 
 <div> 
  I'm buried in divs 
 </div> 
 </div> 
</div> 

You start by cutting out all but the outermost. Validate. If it works, put the second layer back in, cut the innermost. Validate. If you put the last in and validation fails, you've narrowed it to just the inner div, keep cutting until you find the errant chunk.

[dpinion]

I would second rocknbil's method and add a very fast way to do this is to install the firebug extension into firefox if you don't have it already. That way you can look directly at the page output and alter it until you have found your bug.