Using css grid to overlay items

css grid can be used to position an item on top of another instead of position relative-absolute

November 4, 2024

      <div className="grid w-full items-center justify-center">
        <div className="col-start-1 row-start-1">
          <img
            height={200}
            width={200}
            src={"https://picsum.photos/id/62/200/200"}
            className="object-cover"
          />
        </div>
      <div className="col-start-1 row-start-1 text-center font-bold text-2xl">Text on image</div>
      </div>