Recently I was having a task for creating Power BI chart and embedding it in SharePoint. So It is easily available in google. But the tricky part is when you embed it in SharePoint as iframe, it will show share button at bottom of it. Our client do not want that.
Here is the bottom of iframe:
So what is solution:
We add a new div tag and append our iframe within that with little css touch. Below is code for same:
Code sample:
<style>
.iframebox{width:100%; float:left;position:relative; overflow:hidden}
.iframefooter{
width: calc(100% - 40px);
background: #eaeaea;
/*background: #eaeaea;*/
height: 31px;
display: block;
position: absolute;
bottom: 5px;
right:40px;
z-index: 9999999999;
}
.blueborder{
position: absolute;
left: 0;
bottom: 41px;
height: 1px;
background: rgb(36, 65, 153);
z-index: 999999999999999999;
width: 100%;
}
.ms-dlgContent {z-index: 99999999999 !important;}
</style>
<div class="iframebox">
<!-- Iframe code goes here -->
<div class="blueborder"> </div>
<div class="iframefooter">
<br>
<br>
<br></div>
</div>
Output:
Happy coding.
Wednesday 29 November 2017
Subscribe to:
Posts (Atom)
-
In last blog we learn how can we enable footer on SharePoint Online Modern Communication site. If you have not gone through that you can use...
-
One of our client wanted to show Employee Directory and our first suggestion was to build custom SPFx which will fetch data from Azure AD or...
-
Recently I was working on sending mail using smtp server where I stuck on below error: IIS/SMTP - emails are stuck in mailroot/Queue ...