We Keep Coding

Fullscreen icon is missing on Wordpress using iframe

I'm creating a Wordpress site using HelpGuru by HeroThemes (https://herothemes.com/)
I added an iframe to show a vimeo video. This is my code snippet:
<div style="padding:55.83% 0 0 0; position:relative;">
<iframe src="(url)" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen style="position:absolute ;top:0; left:0; width:100%; height:100%;" title="(title)">
</iframe>
</div>
<script src="https://player.vimeo.com/api/player.js"></script>
I removed the original url and title of anonymous reasons.
What I expect, and what I also get when I add this code snippet in any html editor (like W3Schools') is to display the video including a fullscreen button to show the video in fullscreen.
However the button is always missing.
What I tried:
I added allow="fullscreen" (How to enable fullscreen in IFrame) aswell as the allowfullscreen tag (see iframe docs).
In the wordpress preview it also does seem to work. Theres no extra styling added to it.
I also tried to have a look at the iframe with the chrome dev tools, there the buttons' display property is set to "none". However just forcing it to be "flex" is not going to work, as the button would not do anything then.

IFrame frameborder 0, snapping to content only on Chrome

So when I add no frameborder 0 on this external source iframe, it is ONLY snapping correctly on Chrome. Edge, FF, and IE it looks like crap. I cant effect the css either. Any idea what I could do here?
Correct look on Chrome.
How it looks on every other browser.
Here is the iFrame
<iframe name="iframe" id="iframe" src="https://www.disprism.com/webar/login/" style="overflow:hidden;" allowTransparency="true" frameborder="0" scrolling="no" height="300"></iframe>

I'm not sure what you want here, can you be more precise? Your problem is the grey block on I.E right?
If my assumption is correct, then you should use "css borders" instead. Frameborder is not supported in HTML5.
Maybe try something like this https://codepen.io/Tryanium/pen/VRQjWK
#iframe{border: 0px;}
Source : https://www.w3schools.com/tags/att_iframe_frameborder.asp
EDIT :
I try on my computer on I.E
As you can see I don't have any grey block, can you show us the rest of your CSS?

Unable to interact with iframe in Chrome or IE - cross domain JS error?

I am attempting to make my website use TLS / https. This problem occurs only on the https version and not the older http version of the website.
I have a link on my website which when clicked reveals an iframe on top of the rest of the website content.
The link looks like this:
Speed Check
It reveals this div (slightly modified to remove my actual URL)
<div id="speedtestmodal" class="reveal-modal tiny open" data-reveal="" role="dialog" style="display: block; opacity: 1; visibility: visible; top: 1130px;" area-hidden="true">
<iframe width="620" height="420" style="visibility:;" id="example" src="https://page.domain.com" scrolling="no" frameborder="0"></iframe>
</div>
This works and the iframe and expected content is visible, the problem I have is that the page in the iframe contains a text box which the user should fill in. This behaves as expected in Firefox but in Chrome or IE attempting to click into the text box closes the entire Iframe.
The website is beta.domain.com and the iframe is page.domain.com so I thought the problem may be related to cross domain JS calls, to try and get around this I added the following to the head on both websites (as described at http://madskristensen.net/post/iframe-cross-domain-javascript-calls):
<script type="text/javascript">
document.domain ='domain.com';
</script>
But it has made no difference. Is there something that I'm missing here?
Is there any more information that I can provide to help debug this?

It turned out the problem was CSS related and it was only working in firefox due to a bug in the browser.
The Z-index value of the modal was causing it to be hidden behind another semi-transparent modal which is part of a separate function of the website.

PDF inside iFrame not working on iOS

I have been trying to display PDF inside iFrame, it works well for all other browsers and platforms but not working with iOS. When I tried to access in chrome/Safari in iPhone/iPad, it shows the first page BUT does not allow to scroll down the PDF. And when it comes to HTML inside iFrame, it works perfectly, per my observation it looks like issue is with PDF inside iFrame on iOS. Tried all the links provided on various websites, overflow-auto, webkit scrolling, scrolling only y axis, position absolute/relative increasing the height which results in white pages and all other possible solutions, but no luck yet. The language of implementation is ASP.NET-C# where I am setting the iFrame source dynamically. Below is the source through which I am trying to achieve above task.
<div id="wrapper" class="Sales-container container">
<iframe runat="server" id="Contents" class="myiframe" scrolling="no" width="100%" height="100%" frameborder="0" />
</div>
.Sales-container{position:absolute !important;width:100%}
.container{margin-right:auto;margin-left:auto;padding-left:7px;padding-right:8px}
.myiframe{z-index:0;white-space:nowrap}
Any help would be much appreciated.
Thanks.

If you don't need https, you can use the google docs viewer
make the src http://docs.google.com/gview?url=YOURADDRESSHERE&embedded=true
If that won't work for you, I'm currently looking into pdf.js

iframe not working with safari/firefox

I'm trying to figure out why my images aren't displaying properly within my iframe. Every browser works fine with the exception of Firefox and Safari. I can still click the links within the iframe and open up the corresponding page, but the images just won't display. I am using the instansive instagram widget as my iframe content (instansive.com). Their code looks like this - >
<!-- INSTANSIVE WIDGET --><script src="//instansive.com/widget/js/instansive.js"></script><iframe src="//instansive.com/widgets/427ad0d8ae95cfc36f19bb10c960dbf03bbef870.html" id="instansive_427ad0d8ae" name="instansive_427ad0d8ae" scrolling="no" allowtransparency="true" class="instansive-widget" style="width: 100%; border: 0; overflow: hidden;"></iframe>
I'm not sure as to what I am doing wrong, or why it isn't displaying correctly with these two particular browsers.

There is nothing to do with iframe. Try giving the image path as /test/image.jpg instead of full path. This may work