my problem is relatively simple, I believe. I am trying to embed a pdf file and I have tried via object and iframe, but I can never force a 100% height. Why is that? Is there a workaround to do so? Right now I use and I only get about 100px height. By changing the style it does not work either. My problem can be viewed here:
Thank you so much,
5 Answers, 1 is accepted
The problem is that the flexbox our Views use while sizing correctly, does not actually set any height on its contents, thus height: 100% will not work out of the box, unless we set position: absolute to the object. Additionally there's the View Scroller that also prevens proper sizing, which we can easily remove with the View data-stretch="true" option. After doing these, everything works - check the modified demo.
for our company it will also be important to embed .pdf files. Nevertheless, the demo you posted works for my Chrome browser, but once I upload the file to try it on my iOS devices data-stretch locks the view and I cannot scroll to the second page of the file. Is there a fix for mobile browsers?
Unfortunately this is down to the way Mobile Safari is handling PDF viewing. There are no controls provided and in order to support scrolling, you will need to introduce a scrolling container and enable the native scrolling of the view. You should also specify the width and height of the PDF document in pixels (to show all its pages). Check the modified demo.
this thread discusses problems specific to mobile devices, but in general, Kendo UI does not provide any PDF specific rendering solution. This being said, you should not have any issues embedding something like pdf.js (or an iframe, for that matter) in a kendo window instance.