Showing results for 
Search instead for 
Did you mean: 
smolina74 Frequent Visitor
Frequent Visitor

How to set iframe style for correct mobile tabs visualization

I embedded Power BI reports into my web app. Now I'm having also a mobile view. The problem is that in portrait mode I can see the tabs on the bottom but in landscape mode I see them truncated.

These are the styles I'm using for my iframe:


.report-container iframe {
width: 100vw;
height: 90vh; (by the way I tried several different values here)
border: 0;


This is how it looks in portrait mode: 

Portrait mode


and this is how it looks in landscape mode in a nexus 6p:

Landscape mode


Anyway in an ipad in landscape mode this works fine, but this should be the case for a smaller device also, I think. 


Any idea of whether I should try with different style values? any specific parameter I should pass in the embedded url in order to indicate some sort of Mobile layout?







Moderator v-sihou-msft

Re: How to set iframe style for correct mobile tabs visualization



In your scenario, the tab truncation occurs within iframe itself. It seems to be an issue with REST API when iframe adjust report container with report context in landscape mode on a smaller screen. Currently, there's no parameter in embedded URL which can achieve this "self-adaption". You may try a smaller height value to see if the tab can fully rendered. Please submit an issue on Idea: