Open Radar

 
Summary:
There appears to be a terrible layout problem with Webkit and multicolumn tables.  With pagination, text will be cut in half, and if images are included, the text will get rendered on top of the images and all kinds of funky bad stuff.  This was first discovered in our iPad application and when trying to reproduce it, we successfully reproduced it in desktop Safari using text only HTML, so it would appear to be an issue with Webkit itself.  This issue also appears to have gotten worse with 5.0.

Steps to Reproduce:
Load the attached html into either a UIWebView on the iPhone or with the desktop version of Safari on Lion.  Next, either scroll to the right until the table with "Pulmonic Regurgitation" appears or just search for "Pulmonic Regurgitation".  Notice how the text at the top of the page is cut off.  If you scroll to the left one page, you will see the other half of the cut off page at the bottom.  I also have attached screenshots.  Again, to keep the reproduction of the defect simple, I am not including HTML with images embedded, but with more complex HTML with images, you get even more visibly jarring results.  I have attached a screenshot of what that can look like.
Expected Results:
Tables should be either cut cleanly at the nearest row boundary or moved to the next page.
Actual Results:
Text in table cells gets cut off, and rendered incorrectly when images are included.
Regression:
This was present in 4.3, but got much, much worse in 5.0
Notes:
See attached screenshots and HTML.