I see a lot of frontend developers which are tempted to create monstrous solutions, even if they don’t need to. I’m not sure, if it happens because a lot of people don’t know basic CSS or they think it’s cool to do everything with WebGL, but it happens too often to be a coincidence. Todays demo is pretty simple, but it can show you how to split an image between multiple divs with pure CSS.
UPD: Ana Tudor created a more complex version of this effect for images of any aspect ratio. It also has parameters for panels. It may be hard to understand its logic, but it’s really cool.
UPD: Check out speed coding of this example on the FreeFrontend YouTube channel: