It took me a day of thinking and tinkering, but I found the correlation.

First, observe the attached screenshot of Firefox. Observe that the login block has lost its dark shading, and the XML block on the right is pushed over and up.

This happens when the node, (in this case, the first node) is surrounded with "div" and "/div" tags. If you remove these DIV tags, you'll see that firefox displays the blocks and the shading of them correctly. (That screenshot is attached in the next followup post.) Internet Explorer displays things correctly no matter what.

I mention this for two reasons. Users who copy and paste things from Word will probably have these DIV tags copied over, causing the problem. Secondly, anyone using Image or Img_Assist has been instructed to permit DIV tags in the Input Format - Filtering sections, so the POTENTIAL exists to create the problem there too.

Users with WYSIWYG text areas are likely to have DIV tags inserted all over the place.

Note that DIV tags can be used WITHIN a node and all is well (observe the embedded images in the second and third posts). The problem seems to happen when the DIV tag is the very first tag in a node.

So that's the problem. I have no idea how to fix it.

CommentFileSizeAuthor
#1 firefox_no_div.jpg239.59 KBwernst
firefox_div_error.jpg238.04 KBwernst

Comments

wernst’s picture

wernst commented
StatusFileSize
new firefox_no_div.jpg239.59 KB

Here is the second screen shot mentioned in the first post.

Steven’s picture

Steven commented

The problem is more likely that the closing div tag for the first div in question is cut off by the teaser code. This causes the theme layout to be broken as the HTML is invalid.

Install htmlcorrector.module, or manually place your <!--break--> so it does not cause invalid HTML.