'How to center an iframe code for webpage?

Here is the code I want to have centered in the page element...right now it aligns itself to the left:

<iframe id="booking-iframe" sandbox="allow-top-navigation allow-scripts 
  allow-same-origin" style="width: 100%; height: 360px" frameborder="0" 
  src="https://booking.hospitable.com/widget/external/684862"></iframe>

Any help is appreciated...thank you!

htmliframealignment


Solution 1:[1]

Put it in a .

Code:

HTML

<div class="center">
   <iframe id="booking-iframe" sandbox="allow-top-navigation allow-scripts 
     allow-same-origin" style="width: 100%; height: 360px" frameborder="0" 
     src="https://booking.hospitable.com/widget/external/684862"></iframe>
</div>

CSS

.center {
        text-align:center;
        width:100%;
}

Hope I helped :)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nick S

Related Questions