0

my client wanted to convert all images into webp, so I had to use the picture tag to do so, but the final result is a picture tag with 0x0(checked in the google inspector), not sure if that is correct, I do see the picture being served (not sure if it is the webp or png because in the inspector they both load up)

<picture class="mx-auto absolute z-10 -mt-28 left-1/2 -ml-14">
  <source type="image/webp" srcset="http://localhost/images/pirate-footer.webp">
  <source type="image/png" srcset="http:///localhost/images/pirate-footer.png">
  <img id="pirate-img-footer" class="mx-auto absolute z-10 -mt-28 left-1/2 -ml-14" src="http://localhost/images/pirate-footer.png" alt="" loading="lazy">
</picture>

Also not sure if I should load the class styles also in the picture tag and only in the img tag, this example breaks the positioning of the image because there is two position fixed

dreid
  • 163
  • 2
  • 17

0 Answers0