html <picture> element in Webflow

site profile thumbnail
Sometimes you want to use different images for the same section/element in different breakpoints. For example, a landscape image for the desktop breakpoint, and a portrait image for the mobile breakpoint. There are two solutions to this problem. The first solution is to adjust the image wrapper size and set the image to cover the wrapper. The second solution is to use an html `<picture>` element where you can specify images for any breakpoints you want. Until now, Webflow didn’t support the `<picture>` element. Now we can use the custom DOM element and use it as a <picture>. Blog post: https://www.maray.ai/posts/html-picture-element-in-webflow

More sites by Ayk Martirosyan

See profile

Similar sites