MobileRead Forums - View Single Post

_savage · 01-29-2013, 07:01 AM

Just when I thought things started to work on an iPad...

I noticed that text flows into an image:

Code:

  ...
  </p>
  <div style="width:45%; float:left;"><img ... /></div>
  <p>
  ...

This seems to work ok when the paragraph does not break across pages. When it does, however, the image starts at the top of the new page and is scaled correctly. However, the first line of the paragraph on the new page crosses the full width of the page (like on the page before where the image didn't fit) before subsequent lines are rendered next to the image.

I thought this could be solved by avoiding widows and orphans, but that didn't change a thing. There was some talk about wrapping the <img> into a <span> but that didn't work either (it's already wrapped in a <div> anyway).

Is this a page height issue? Or how do I go about this?

01-29-2013, 07:01 AM	#23
_savage Connoisseur Posts: 53 Karma: 10 Join Date: Jul 2012 Location: Seattle, USA Device: Nook	Just when I thought things started to work on an iPad... I noticed that text flows into an image: Code: ... </p> <div style="width:45%; float:left;"><img ... /></div> <p> ... This seems to work ok when the paragraph does not break across pages. When it does, however, the image starts at the top of the new page and is scaled correctly. However, the first line of the paragraph on the new page crosses the full width of the page (like on the page before where the image didn't fit) before subsequent lines are rendered next to the image. I thought this could be solved by avoiding widows and orphans, but that didn't change a thing. There was some talk about wrapping the <img> into a <span> but that didn't work either (it's already wrapped in a <div> anyway). Is this a page height issue? Or how do I go about this?