2016-07-20 1 views
4

Я пытался центрировать пару фреймов на этой странице link. Тем не менее, каждый пример, который я видел, я пробовал и не работает. Вы можете четко видеть параллакс плавающий div, который не центрирован, а внизу iframe для html-страницы плавает вправо, а не центрируется.Как центрировать iframe?

Любая помощь будет высоко оценена.

+0

дисплей: блок + маржа: авто ; ..... ты искал немного? :) –

+0

Я искал около 2 часов, так что да :) Я пробовал это раньше. По какой-то причине это не работает. – Calle

+1

Опять, Ориол, я пробовал это. Это, очевидно, будет первым, что я попробую. Я бы не спросил, работает ли это. – Calle

ответ

3

http://codepen.io/mlegg10/pen/zqLdJy изменения CSS-набивка-сверху и снизу, чтобы удовлетворить ваши потребности

/* 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>

+0

Спасибо! Это сработало. – Calle

4

display:block + margin:auto;

iframe { 
 
    display:block; 
 
    margin:auto; 
 
}
<iframe></iframe>

Смежные вопросы