How to focus on iframe?

Question

I tried to center a couple of frames on this link page . However, every example that I saw I tried and does not work. You can clearly see the parallax floating div that is not centered, and at the bottom of the iframe for the html page it floats to the right, not centered.

Any help would be greatly appreciated.

Answer 1

http://codepen.io/mlegg10/pen/zqLdJy change the css padding-top and bottom according to your needs

/* Flexible iFrame */

.Flexible-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}
.Flexible-container iframe,
.Flexible-container object,
.Flexible-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

<!-- Responsive iFrame -->
<div class="flexible-container">
  <object width="100%" data=""https://drive.google.com/file/d/0BxrMaW3xINrsR3h2cWx0OUlwRms/preview"&amp;toolbar=0&amp;navpanes=0" type="application/pdf">
      <embed width="100%" type="application/pdf" src="https://drive.google.com/file/d/0BxrMaW3xINrsR3h2cWx0OUlwRms/preview"?scrollbar=0&amp;toolbar=0&amp;navpanes=0">
    </object>
</div>

Run codeHide result

Answer 2

display:block + margin:auto;

iframe {
  display:block;
  margin:auto;
}

<iframe></iframe>

Run codeHide result