Хронический баг с srcset и размерами?

Похоже, что браузеры на основе хрома не выбирают правильное изображение в некоторых ситуациях. Не видел этого раньше.

img {
  max-width: 100%;
  height: auto;
}
<!--  This bug happens only in chromium based browsers
      If device ratio 2x we will get 960w image instead 1424w (556*2 = 1112px)  -->

<img src="https://place-hold.it/556x480&fontsize=20" width="556" height="480" srcset="https://place-hold.it/556x480&fontsize=20 556w, https://place-hold.it/960x720&fontsize=20 960w, https://place-hold.it/1424x1068&fontsize=20 1424w" sizes="(max-width: 556px) 100vw, 556px">

<!--  But if we set large image to 1112w (insted 1424w) we will get the right image. We will get the right image even if we set 1250w.  -->

<img src="https://place-hold.it/556x480&fontsize=20" width="556" height="480" srcset="https://place-hold.it/556x480&fontsize=20 556w, https://place-hold.it/960x720&fontsize=20 960w, https://place-hold.it/1112x1068&fontsize=20 1112w" sizes="(max-width: 556px) 100vw, 556px">

<img src="https://place-hold.it/556x480&fontsize=20" width="556" height="480" srcset="https://place-hold.it/556x480&fontsize=20 556w, https://place-hold.it/960x720&fontsize=20 960w, https://place-hold.it/1250x1068&fontsize=20 1250w" sizes="(max-width: 556px) 100vw, 556px">

Что вы думаете, ребята?

0 ответов

Другие вопросы по тегам