How to center an iframe horizontally?

Question

Consider the following example: (live demo)

HTML:

div

CSS:

div         


        

Answer 1

Add display:block; to your iframe css.

div, iframe {
    width: 100px;
    height: 50px;
    margin: 0 auto;
    background-color: #777;
}

iframe {
    display: block;
    border-style:none;
}

div