Power BI Iframe settings for a container web and mobile (responsive)

[controllingARS]

Hello community,

can you please help us with our problem to change /model  the iframe into a responsive version or something like this.

First off all we are no professionals in case of html coding ;D

We want our public iframe to be in a container in our workforce platform  (core smartwork) on the dashboard.

We have tried this so far:

<div style="width:415px; height:220px; overflow: hidden">

<center>

<iframe width="380" height="260", src="iframe…" frameborder="0" allowFullScreen="true" ></iframe>

</center>

</div>

Output is this one :container in normal webbrowser size

Looks pretty good but is there a simple way to change or resize the width, so on mobile or changing webbrowser window will change/resize the iframe?

output container when the browser is changing its size

Thank you so much.

Kind regards Andreas

[selimovd]

Hey @controllingARS ,

you have to adjust that with the CSS for the iFrame. I think the following options should work:

style='position: fixed; width:100%; height:100%'

So the iFrame would look like this:

<div style="width:415px; height:220px; overflow: hidden">

<center>

<iframe width="380" height="260", src="iframe…" frameborder="0" allowFullScreen="true" style='position: fixed; width:100%; height:100%'></iframe>

</center>

</div>

If you need any help please let me know.

If I answered your question I would be happy if you could mark my post as a solution ✔️ and give it a thumbs up 👍

Best regards

Denis

Blog: WhatTheFact.bi

Follow me: twitter.com/DenSelimovic

[controllingARS]

@selimovd

Thank you Denis, for you quick reply.

Unfortunatly now the iframe is on the right bottom.

The iframe should go into the empty middle container.

Thank you.

Kind regards

Andreas

[selimovd]

Hey @controllingARS ,

then you still have to position it with CSS.

If you share the link I can help you, otherwise you have to try until it fits or to calculate the position based on your canvas size.

If you need any help please let me know.

If I answered your question I would be happy if you could mark my post as a solution ✔️ and give it a thumbs up 👍

Best regards

Denis

Blog: WhatTheFact.bi

Follow me: twitter.com/DenSelimovic