Member Avatar for saucy6969

Hi there,
In my current website, my iFrames layout has suddenly shifted on me after uploading the new images from the graphic designer this evening. (exact same size/shape as last year, just different design).

So all I did was overwrite last years images and upload and suddenly everything in the middle section (home.html) has shifted about 1-1.5" to the right. Normally the text would sit 1/8-1/4" away from the nav buttons.

Can anyone take a look and possibly help me get this back to normal. I tried overwriting the code in both index and home.html pages with last year's code but it didnt change anything. What's going on?

  • 2 Contributors
  • 2 Replies
  • 86 Views
  • 22 Hours Discussion Span
  • Latest Post Latest Post by saucy6969

Dani AI

Generated

Good outcome: 's compatibility-mode suggestion fixed the shift for . That result usually means IE8 was using a different document mode or rendering behavior than the page was designed for. When swapping graphics causes only one browser to move a centered iframe section a noticeable amount, a short, focused checklist helps separate a browser-mode issue from a markup/CSS problem.

  • Verify IE's Browser Mode and Document Mode with its developer tools; mismatched modes (standards vs compatibility) are a common reason for a sudden horizontal offset.
  • Open the iframe source directly and inspect computed box-model values for the iframe and its container; unexpected margins, borders, or a newly appearing scrollbar can reduce available width and push content.
  • Confirm the iframe document has a proper standards DOCTYPE and valid markup; missing or malformed HTML often triggers quirks-mode rendering.
  • Use an IE-only stylesheet or a temporary compatibility header/meta as a stopgap to restore layout quickly, but treat that as short-term while you investigate the root cause.

Caveat: forcing older IE modes can mask real layout bugs. The long-term fix is to make the iframe content standards-compliant (validate HTML/CSS, remove reliance on browser quirks) so the design renders consistently across modern browsers.

Recommended Answers

All 2 Replies

Member Avatar for PsychicTide

everything looks fine to me on every browser except IE8... I'm assuming that's what your viewing it from?

If so there are a couple quick fixes you can use... CSS hacks or conditional statements are always an option(several of them... I can provide links if needed, but google should take care of that) or a compatibility mode meta tag such as...

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>

. Sometimes this doesn't work for certain elements because of the emultaion bugs, but for your case it should be fine.

Let me know if this helps at all.

Edited by PsychicTide because: n/a
Member Avatar for saucy6969

hey mate, brilliant! that worked! thanks a million!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.