Firefox - writes to screen before it reads entire page layout - content jumps around on load.

I have several sites where the 800 pixel fixed width content floats off-center to the left in the browser window.  The page-content is in the middle of 3 overall layout columns with the left and right columns as width="x%" so the page-content will float with a bias to the left in the window.

This all works fine in IE because it reads all 3 layout columns before it starts writing to screen - so it positions the center page-content column in the correct place.

In Firefox the content columns starts by loading on the right side of the window and then jumps to the correct position after the 3rd column is read.

Is there a way to float a page-content column with a bias to the left in Firefox.   The left column can't be a fixed width because the content must shift to the left to fit in 800 Pixel Windows.  Is there a function of some type to keep firefox from displaying the page before it knows what the page layout is ?

http://sbcert.com
swbruce21Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

COBOLdinosaurCommented:
The "problem" with Firefox is that it tries to optimize the load.  If you could do some to control that it would make the page even slower to load.

You are looking gfor the wrong solution to the wrong problem.  All page with any content tend to have some intermediate rendeing as the page loads. EE does Yahoo does, Amazon, Ebay, etc. So what is the normal behaviour the user are used to seeing.

The problem you need to address is that your page is bloated, and slow loading. Finding a way to prevent intermediate rendering is just going to make the real problem worse.If you want to improve the way the page does intermediate rendering then then you need to look at the problems in the page.  and you not going to like it because it looks like you are big on Microsoft.

1. Its and MSHTML page based on the meta tags.  That would explain a lot of the bloat, and the references to the obsolete document.layers object; as well as the use of so many depreciated attributes.  Plus like all MS web page generators, by design it output code that will impair and even break non-IE browser
2.  The scripting is inefficient.
3.  20th century style table managed layout are easy for genrators, but produce the possible loading pages.
4.  The total grphaics load contributes, especially using jpg instead of gif, but they just contribute to a load slowed by the table based layout.

So if you don't like the effect that is shown during the load, the solution is to fix the page to load faster.

Cd&
0
COBOLdinosaurCommented:
I also notice a real time lag with not responses too you.  This is a well staff topic and normally 10 during the day for responses.  However I suspect some experts were reluctant to post because clearly are a miscro soft person and there is no way to answer honestly without appearing to be MS-bashing.  Most would rather not debate MS strngths and weaknesses.

Cd&
0
craigwardmanCommented:
you could enclose each of the 3 sections within a tag, such as <DIV> with style: 'visibility:hidden;'

at the very bottom of the page, (the last part to load), use this code:

<img src="javascript: finishedLoading()" width=0 height=0>

put a JS function, as above, which sets the style of the 3 tagged fields (the <DIV> for e.g.) back to "visibility:visible;"

you could also include a 4th tag field, to say 'Page Loading...' and then hide this later..
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.