At the page link to below, the guide says that background images can be made responsive by specifying different images at different breakpoints but does not explain how it is done. The exact instructions are, "Images can also be changed at breakpoints, this way smaller and lighter file size images can be served to smaller devices (which frequently use less bandwidth). This is also handy if you want to show a cropped version of the image for smaller screens."

I played around with it but don't see how it is done. Thanks in advance for any help.

https://tutorials.coffeecup.com/site-de … background

Check out the link in my signature, choose your framework (BareBone is the same as Frameworkless), and open the 'Optimal Image Sizes' component. You can download it if you like.

Inger,
Thanks! I've downloaded the Foundation component and will give it a try today. You have an impressive collection there. Well done.