Amaryllia Liu wrote:
> http://www.erotophilia.com/July2006/brokenlayout.html
>
> When any of the anchor links on top are clicked, the page layout
> breaks in FF, but seems to work find in IE. This is a fairly simple
> page so I'm hoping the problem is also a simple fix.
No really simple fixes, I'm afraid, since the page layout rely on a
number of /bugs/ in Internet Explorer - especially the 'Layout'[1] bug,
and other browsers can hardly replicate them all.
This means that since all elements' positions are based on offset from
default-positions, and that default-position rely on dimensions given to
other elements - partly by the browsers, the whole layout becomes a
"house of cards" that will loose positions if/when *one* element's
position and/or dimension changes.
> I would greatly appreciate any help or suggestions in how to debug
> this.
Simplest solution: change your 'position: relative' based layout to a
'position: absolute' based one - relative to div#main, and there won't
be any IE-bugs to replicate.
Add...
div#main {position: relative;}
...and change all existing 'position: relative' to 'position: absolute'
and give them new 'top' values relative to top of div#main.
I did a test on a few parts, and it became perfectly stable in all
browsers in all situations, and reacted just fine to in-page link clicks.
I didn't bother to test restyling for all element, since - needless to
say - the whole layout is/will be ruined when subjected to any degree of
'font-size options' in any browser. That will happen regardless of
solution since it is laid out on top of a single background-image.
Your existing layout/design is also not very end-user friendly at
default, since it doesn't work well on smaller browser-windows.
800x600 is "no good", and I think it should at least be made to work at
that window-size.
So, it looks like a "back to the drawing-board" layout that is in need
of a little more than a "fix" - sorry.
regards
Georg
[1]http://www.satzansatz.de/cssd/onhavinglayout.html
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
