Rebecca Springer
Rebecca Springer
adding a minimum height to the para and page-break-inside:avoid seem to reduce the frequency somewhat, but not totally resolve
Here's a chunk of the HTML ``` 1 Soak rice noodles according to package directions; drain. 2 Meanwhile, in a very large skillet heat oil over medium-high heat. Add chicken;...
Interesting -- so you think it's the negative margin-bottom in the drop cap? Those margins came out of InDesign. I'll give it a try squeezing line-height instead.
I really wish this would have worked, but no: alignment is off for all step-nums and the page-break problem is still there. 
Based on data from the iBooks Inspector, I believe this problem is related to the user stylesheet property html {-webkit-line-box-contain: block glyphs replaced;}. There is a CSS Inline Layout Module...
Although no other reading system does this, technically it may not be a bug (see http://www.smashingmagazine.com/2007/05/01/css-float-theory-things-you-should-know/) Fix is to float the text as well, if feasible, or to replace border...
better, less invasive fix for a right-floated image: specify a max-width: 100%-(width-of-image+padding) on the element with the border