Strange HTML table behavior in Firefox and Safari

[fabrizio]

Hello here.

I have a strange issue I'd like to have your opinion for. If you try to look at the following page with Firefox or Safari (on a Mac of course), and try to reload the page several times, sometimes you'll notice that the left main navigation table shrinks to the left. The issue appears to be random:

http://www.virtualsheetmusic.com/dow...ven/Eliza.html


Any idea and thought are very welcome. Thank you in advance.

Sincerely,
Fabrizio

[Mittineague]

Just a guess. I think it may have something to do with the "body onload focus" to the search. I read somewhere about a browser bug where some elements expanded when they got focus. (Sorry, but I don't remember more details) What happens if you (temporarily) remove the onload focus to the search?

[fabrizio]

You are right! By removing the following attribute from the BODY tag:

onLoad="document.searchform.elements[0].focus()"

the problem disappears... it's amazing! Do you know how to avoid it? Do I need just to avoid the focus?

Also, it's anyway weird because not all the pages have the same issue. For example, the following page has the same attribute for focus but the shrinking effect doesn't appear:

http://www.virtualsheetmusic.com/Downloads.html


Any idea?

Thank you again very much.

Sincerely,
Fabrizio

[Mittineague]

I tried finding that page again, but no luck. I do notice a difference between the 2 pages you linked to though. The "Eliza" page has the form in

<TD valign="top" align="left" bgcolor="#FFFFFF" width="180">

and the "Download" page has the form in

<TD valign="top" align="left" bgcolor="#FFFFFF" width="5%">

Although it seems the width is really more like 20% to me with 600x800 res.
Anyway, maybe giving the Eliza page a width att val of 5% too (if that's really what you intended) will fix it.

[fabrizio]

Well, at first seemed to work but instead the problem seems to be persistent... do you have any other idea? I'll investigate more...

Thank you.

Sincerely,
Fabrizio

[fabrizio]

I really don't understand... the problem is completely random. Please, could you tell me if you see what I mean too? Try to see the following page in Firefox and try to reload it several times until the left navigation box shrinks:

http://www.virtualsheetmusic.com/dow...ven/Eliza.html


Thank you for your help.

Sincerely,
Fabrizio

[Mittineague]

I did see the effect yesterday a few times. Now it looks like the left nav is OK to me. I do see some "shifting around" as things load in. Are you sure that what you are seeing as the left nav expanding isn't really the top nav links sliding left a bit? I also notice the center column adjusts as the right column loads in. Using relative sizes is a good thing IMO, so I wouldn't change that. I think some browser adjustment of layout during page load is quite normal. The browser adjusts for viewport dimensions, text size settings, image loading enabled, CSS enabled etc.
So I guess what I'm getting at is, Do the pages look consistant after they have finished loading? If what you are seeing is loading adjustments I woulsn't worry about that, but if the pages look different after the browser finishes rendering them, then that's a concern.

[fabrizio]

I found where was the problem: a javascript function. There was an unused javascript function that caused that issue! By removing it fixed the problem. Strange, isn't it? At least we learned a lesson: avoid unused javascript functions!

Thank you again very much for helping me to find this out, it has been really appreciated.

Sincerely,
Fabrizio