No veo el '...' después de configurar los puntos suspensivos de texto, el desbordamiento oculto y ahora en este div.

Aquí está mi código:

 import Image from "next/future/image"; import Link from "next/link"; export default function MenuOption({ title, description, icon, route }) { return ( <Link href={route}> <div className="flex h-[74px] w-full cursor-pointer gap-4 overflow-hidden text-ellipsis rounded-lg bg-gray-50 p-4 ring-1 ring-gray-300 drop-shadow-sm hover:ring-2"> <Image src={icon} alt={`${title} Icon`} className="mt-1 h-5 w-auto" /> <div className="float-left inline-block overflow-hidden text-ellipsis whitespace-nowrap"> <h2 className="text-md font-medium text-gray-900">{title}</h2> <p className="text-sm text-gray-500">{description}</p> </div> </div> </Link> ); }