How to "fill" background image? [duplicate]

Question

I'm making a website where I need to have a notable difference between fill and center background images. My template is this:
Center: Uses native resolution to determine size. Fill: Fits sides to fill screen without changing aspect ratio. Two sides exactly fit screen, while other two are cut off.

I managed to get centered with

.center {
    background-repeat: no-repeat;
    background-size: auto auto;
    background-position: center center;
}

But I can't figure out how I would do fill. Any insight?

Answer 1

I believe you want background-size: cover. Other background-size options.