It seems something like the following strategy might work more reliably:
function keepAlignment( sourceNode, targetNode ) { var offsetTop = Math.max( sourceNode.offsetTop, targetNode.offsetTop ); sourceNode.style.paddingTop = ( offsetTop - sourceNode.offsetTop ) + 'px'; targetNode.style.paddingTop = ( offsetTop - targetNode.offsetTop ) + 'px'; }
It doesn't require all previous sections to be in alignment, and it doesn't change the height of the content (and therefore hopefully shouldn't change the word wrapping nor cause much browser rerendering effort).