vercel/next.js · error · Error

Image with src "${src}" has both "fill" and "style.position"

Error message

Image with src "${src}" has both "fill" and "style.position" properties. Images with "fill" always use position absolute - it cannot be modified.

What it means

Props validation in getImgProps: fill was combined with a style.position other than absolute. Fill images are always position:absolute, so allowing a different position would break the layout contract; the style override is rejected.

Source

Thrown at packages/next/src/shared/lib/get-img-props.ts:493

    if (!src) {
      // React doesn't show the stack trace and there's
      // no `src` to help identify which image, so we
      // instead console.error(ref) during mount.
      unoptimized = true
    } else {
      if (fill) {
        if (width) {
          throw new Error(
            `Image with src "${src}" has both "width" and "fill" properties. Only one should be used.`
          )
        }
        if (height) {
          throw new Error(
            `Image with src "${src}" has both "height" and "fill" properties. Only one should be used.`
          )
        }
        if (style?.position && style.position !== 'absolute') {
          throw new Error(
            `Image with src "${src}" has both "fill" and "style.position" properties. Images with "fill" always use position absolute - it cannot be modified.`
          )
        }
        if (style?.width && style.width !== '100%') {
          throw new Error(
            `Image with src "${src}" has both "fill" and "style.width" properties. Images with "fill" always use width 100% - it cannot be modified.`
          )
        }
        if (style?.height && style.height !== '100%') {
          throw new Error(
            `Image with src "${src}" has both "fill" and "style.height" properties. Images with "fill" always use height 100% - it cannot be modified.`
          )
        }
      } else {
        if (typeof widthInt === 'undefined') {
          throw new Error(
            `Image with src "${src}" is missing required "width" property.`
          )

View on GitHub (pinned to 0eb3775416)

Solutions

  1. Remove style.position when using fill; wrap the image in a positioned parent instead.
Defensive patterns

Strategy: validation

When it happens

Trigger: next/image with fill also sets style.position.

Common situations: fill images always use position absolute; custom style.position is rejected.


AI-assisted analysis of vercel/next.js@0eb3775416 (2026-08-19). Data as JSON: /api/errors/2c44b7ad7574c877. Report an issue: GitHub.