You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I'm reopening the issue because the first one was closed even though the problem still exists. #1331
Description
There seems to be a misconfiguration issue with how NuxtImg handles the sizes attribute, particularly with the assignment of default and conditional sizes based on breakpoints.
Issue
It's written in the documentation.
If you omit a screen size prefix (like sm:) then this size is the 'default' size of the image. Otherwise, Nuxt will pick the smallest size as the default size of the image.
This default size is used up until the next specified screen width, and so on. Each specified size pair applies up - so md:400px means that the image will be sized 400px on md screens and up.
That is, it is planned that for such a configuration 100vw sm:50vw md:400px
100vw will be for everyone, sm:50vw - the sm prefix for 50vw, md:400px - the md prefix for 400px
in HTML, it should look something like (max-width: sm) 50vw, (max-width: md) 400px, 100vw
but in fact, the pairs are created not through :, but through a space, and are separated by :.
and the result we have is (max-width: sm) 100vw, (max-width: md) 50vw, 400px
I tested many times, check it yourself. Either the documentation is incorrect, or the logic
I can provide additional data directly with screenshots of the problem from my server.
The text was updated successfully, but these errors were encountered:
I'm reopening the issue because the first one was closed even though the problem still exists. #1331
Description
There seems to be a misconfiguration issue with how
NuxtImg
handles the sizes attribute, particularly with the assignment of default and conditional sizes based on breakpoints.Issue
It's written in the documentation.
That is, it is planned that for such a configuration
100vw sm:50vw md:400px
100vw
will be for everyone,sm:50vw
- the sm prefix for 50vw,md:400px
- the md prefix for 400pxin HTML, it should look something like
(max-width: sm) 50vw, (max-width: md) 400px, 100vw
but in fact, the pairs are created not through
:
, but through a space, and are separated by:
.and the result we have is
(max-width: sm) 100vw, (max-width: md) 50vw, 400px
I tested many times, check it yourself. Either the documentation is incorrect, or the logic
I can provide additional data directly with screenshots of the problem from my server.
The text was updated successfully, but these errors were encountered: