Posts

Showing posts with the label iframe

How to center an Youtube iframe horizontally?

Image
How to center an iframe horizontally? To center a YouTube <iframe> horizontally, you can use CSS.  To make you frame center you need to give your videowrapper a specific width and make the margin left and right as auto . Despite you wanna make your frame responsive always use max-width: 100% to your videowrapper .  Here's how you can do it using different approaches: 1. Using text-align on a Parent Container Wrap the <iframe> in a parent container and apply text-align: center to the container. html < div style = "text-align: center;" > < iframe width = "560" height = "315" src = "https://www.youtube.com/embed/dQw4w9WgXcQ" title = "YouTube video player" frameborder = "0" allowfullscreen > </ iframe > </ div > 2. Using Flexbox Flexbox is a modern and robust way to center elements. html < div style = "display: flex; justify-content: center;" >