Как центрировать iframe по горизонтали?

Рассмотрим следующий пример: ( живая демонстрация )

HTML:

div

CSS:

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

Результат:

Почему iframe не выровнен по центру, как div ? Как мне выровнять его по центру?