background-size: containensures that the entire background image will fit the background area, keeping its original aspect ratio. If the background area is smaller than the image, the image will shrink so that it can fit the background area. If the background area is either taller or wider than the image, then any parts of the area not occupied by the main image will either be filled by repetitions of the image, or letterbox/whitespace ifbackground-repeatis set tono-repeat.background-size: covermakes the background image as large as possible such that it will fill the entire background area leaving no gaps. The difference betweencoverand100% 100%is that the aspect ratio of the image is preserved, so no unnatural stretching of the image occurs.