I have found a fix for this, and understand what was happening, but not why.
This page is set up to show tabs - you click on a tab and get different information. I had set it up so that to turn tabs on and off I simply set the height of the div that defines the tab to be 1 pixel taller
height:42px
instead of
height:41px
. Since the tabs are positioned
top:0px
this caused the bottom of the div to drop down over the border of the page div below, thus making the tab look attached to the page.
This worked fine, but it turns out pushing the tab div over the top of the border was causing the text to be pushed to the right of the tab div. Since it was only extending over the top of the border, not past the the border, I don’t understand why it would interfere with the text. And in fact, in Chrome, using the inspect element tool, it showed the text box actually one or two pixels below the border.
I fixed it by making the tab divs remain a constant height and switching background images between one that was 41 pixels and another that was 42 pixels (with overflow:visible). But I would still like to understand why the tab div poking over the border affects the text positioning on the next line.
thanks
Anne