All questions I come across talk about keeping an image's aspect ratio. I don't want the image to keep its aspect ratio. I want the image's width to exactly match the container's width, and the image's height to exactly match the container's height. The container is responsive.
None of the settings I have tried solve this problem. Assuming my image is originally square and the responsive container is a horizontal rectangle:
background-size: cover; This fills the container horizontally but keeps the aspect ratio, so it doesn't squash the image to fit completely within the container.
background-size: contain; This fills the container vertically but repeats the image to fill it horizontally. It does not stretch the image horizontally to fill the container.
Auto, inherit, unset, etc. are all just variations of keeping the aspect ratio.
How can I make it so that my image dimensions match exactly the responsive container dimensions?
My website project is only using DJango, CSS, HTML.
(Thanks to Sfili_81 and A Haworth in the comments)
The answer is to set the background size using the following:
background-size: 100% 100%