title: embaded images are breaked between pdf pages in flaying-saucer
body: <p>I have some problem with images (all images are embedded in html as base64 strings). 
  I use css </p>
  
  <pre><code>img {page-break-inside: avoid;}
  </code></pre>
  
  <p>and it helps but not always.
  In some cases the same image can be processed correctly where in other situation is divided between pages. </p>
  
  <p>It depends form many factors, examples:</p>
  
  <ul>
  <li>image is assigned as block element</li>
  <li>previous images are or are not    block elements</li>
  <li>there is some big image before divided one</li>
  </ul>
  
  <p>I also noticed that if the problem occurred at least once than all images to the end of document can be broken when they don't fit on the page.</p>
  
  <p>I'm using this approach with RepleacedElementFactory for embedded images:
  <a href="http://www.intelligrape.com/blog/using-data-urls-for-embedding-images-in-flying-saucer-generated-pdfs/" rel="nofollow">http://www.intelligrape.com/blog/using-data-urls-for-embedding-images-in-flying-saucer-generated-pdfs/</a></p>
  
  <p>the only difference is that i'm changing the size a bit </p>
  
  <pre><code>public ReplacedElement createReplacedElement(LayoutContext c, BlockBox box, UserAgentCallback uac, int cssWidth, int cssHeight) {
   Element e = box.getElement();
   if (e == null) {
       return null;
   }
   String nodeName = e.getNodeName();
   if (nodeName.equals("img")) {
       String attribute = e.getAttribute("src");
       FSImage fsImage;
       try {
           fsImage = buildImage(attribute, uac, cssWidth, cssHeight);
       } catch (BadElementException e1) {
           fsImage = null;
       } catch (IOException e1) {
           fsImage = null;
       }
       if (fsImage != null) {
           if(cssWidth == -1 &amp;&amp; cssHeight == -1)
           {
              int factor = _sharedContext.getDotsPerPixel();
              int width = fsImage.getWidth();
              int fWidth =  width * factor;
              fsImage.scale(fWidth, -1);
           }
           if(cssWidth == -1 || cssHeight == -1)
           {
              fsImage.scale(cssWidth, cssHeight);
           }
           return new ITextImageElement(fsImage);
       }
   }
   return null;
  </code></pre>
  
  <p>}</p>
  
  <p>the difference is I've added this block:</p>
  
  <pre><code>if(cssWidth == -1 &amp;&amp; cssHeight == -1)
           {
              int factor = _sharedContext.getDotsPerPixel();
              int width = fsImage.getWidth();
              int fWidth =  width * factor;
              fsImage.scale(fWidth, -1);
           }
  </code></pre>
  
  <p>to give proper size if it is not given by css. Without it I had the problem with all images be really tinny.</p>
  
  <p>I guess there is some problem with calculating the real size (height) of the picture but I really don't have idea what else can i change to guarantee that images would never break between pages.</p>
  
  <p>Please help. </p>