Как работает background-size:cover?

cover - это растянуть по высоте и ширине так, что бы полностью закрыть блок и не изменить пропорции картинки. Так что в зависимости от размеров блока и картинки обрежется либо по ширине, либо по высоте.
Если надо вписать в блок не обрезая - тогда это background-size:contain;
Если пропорции Вас не интересуют, тогда background-size: 100% 100%;

Что Вы хотели спросить Вашим codepen - так и не понял

background-size:100% 100%;