Удалить лишнее пустое пространство, окружающее фреймы iframe?

Я использую фреймы на своей странице и наткнулся на странную проблему. Я установил iframe css так

iframe {
    margin: none;
    padding: none;
    background: blue; /* this is just to make the frames easier to see */
    border: none;
}

Однако вокруг iframe все еще есть пробелы. Я тестировал его как в Chrome, так и в Firefox, и это то же самое. Я поискал, но ничего не нашел. Этот пробел также не отображается в консоли Chrome. Кроме того, у меня уже есть следующий CSS:

html, body {
    margin: 0px;
    padding: 0px;
    border: 0px;
    width: 100%;
    height: 100%;
}

JSFiddle: здесь