next/image is causing layout shift

[trail saddle]

This is my code:

      <div className="flex justify-around">
        <div className="flex flex-col">
          <p>img</p>
          <img alt="everest" width={400} height={400} src="https://i.imgur.com/z6vW3WI.jpeg" />
          <p>Some content below</p>
        </div>
        <div className="flex flex-col">
          <p>next/image</p>
          <Image alt="everest" width={400} height={400} src="https://i.imgur.com/z6vW3WI.jpeg" />
          <p>Some content below</p>
        </div>
      </div>

And as you can see below, next/image is causing the layout shift while the <img> tag is not shifting the layout.
I'm so confused this shouldn't be happening with next/image.

Okay the width and height is not actually getting applied, if i add the style tag and specify width and height then it gets applied, so i guess the width and height props on next/image are getting ignored?

      <div className="flex justify-around">
        <div className="flex flex-col">
          <p>img</p>
          <img alt="everest" style={{width:400, height:400}} src="/everest.jpg" />
          <p>Some content below</p>
        </div>
        <div className="flex flex-col">
          <p>next/image</p>
          <Image alt="everest" width={400} height={400} style={{width:400, height:400}} src="/everest.jpg" />
          <p>Some content below</p>
        </div>
      </div>

[trail saddle]

bump!