Next.js Discord

Discord Forum

Image

Unanswered
Snowshoe posted this in #help-forum
Open in Discord
SnowshoeOP
How can i get the image to only fill the 400x400px div?

      <div id="observe2" className="md:w-[400px] md:h-[400px]">
        <div id="img2" className="w-full h-full bg-black/[0.6] rounded border-2 border-dashed">
            <Image
                src={mh}
                alt="Dejlige ting"
                width={400}
                height={400} 
            />
          </div>
      </div>


Currently it looks like this

2 Replies

@Snowshoe How can i get the image to only fill the 400x400px div? html <div id="observe2" className="md:w-[400px] md:h-[400px]"> <div id="img2" className="w-full h-full bg-black/[0.6] rounded border-2 border-dashed"> <Image src={mh} alt="Dejlige ting" width={400} height={400} /> </div> </div> Currently it looks like this
Clown
"The width and height attributes are used to infer the correct aspect ratio of image and avoid layout shift from the image loading in. The width and height do not determine the rendered size of the image file."
- Next Docs