Most of the pages on my website have similar markup, with the majority of them being created using php includes. However, there is one page that behaves differently in various browsers.
All pages except for one (which is dynamically generated) display properly across all browsers, including ie6.
The problematic page (for example, ) functions correctly in FF3.6, Chrome, Safari (even on iPhone), and IE7.
In IE6, it appears that there are issues with the <DIV>
s on this specific page. Even after removing the floating menu code, the DIVs still do not display correctly.
If you navigate to any other page such as About, the DIV structure works fine in IE6.
I am committed to making sure the website functions properly in IE6. I would appreciate any assistance in identifying why this particular page is behaving strangely.
To clarify, the three problems in IE6 that I am encountering are:
The floating Bookmarks menu shifts to the right corner of the "paper" instead of the window's right corner where it should be.
When moving the bookmarks menu, the coordinates become distorted.
Comparing this page to another like Services in IE6 reveals a slight difference in paper width between the two.
PS: I am aware that the code contains validation issues, specifically related to mismatched ul
's and li
's. This is intentional at the moment.
UPDATE: I have made a significant discovery. It seems that issue #3 is somehow linked to two lines in the CSS:
text-align:justify;
applied to p
and .indented
I would appreciate an explanation for this unexpected behavior.