On the td label, the a label redirect covers the entire box in 2024, while 2021 does not cover it, it only works on the reference number. It also does not cover the entire line.

The image in the Outlook 2021 version

The image in the Outlook 2024 version

 <td
        key={i}
        width={`${Math.floor(100 / question?.choices?.length)}%`}
        height={24}
        align="center"
        style={{
          padding: "0",
          margin: "0",
          display: "table-cell",
          border: `${
            question?.shape === "rounded" ? "" : "0.5px solid #000000"
          }`,
          borderCollapse: "collapse",
          cursor: "pointer",
          width: `${Math.floor(100 / question?.choices?.length)}%`,
          backgroundColor:
            question?.shape === "rounded" ||
            (typeof question?.isColored === "boolean" && !question?.isColored)
              ? "#fafafa"
              : defaultColors[colorIndex][elem.value - startIndex],
        }}
      >
        <p
          style={{
            width: "100%",
            cursor: "pointer",
            margin: "0",
          }}
        >
          <a
            href={`ssssss`}
            target="_blank"
            style={{
              textDecoration: "none",
              display: "inline-block",
              cursor: "pointer",
              textAlign: "center",
              border: `${
                question?.shape === "rounded" ? "0.5px solid #000000" : ""
              }`,
              borderRadius: `${question?.shape === "rounded" ? "50%" : "0"}`,
              width: `${question?.shape === "rounded" ? "20px" : "100%"}`,
              minWidth: `${question?.shape === "rounded" ? "20px" : "35px"}`,
              height: `${question?.shape === "rounded" ? "28px" : "36px"}`,
              lineHeight: `${question?.shape === "rounded" ? "28px" : "36px"}`,
              fontSize: `${question?.shape === "rounded" ? "14px" : "16px"}`,
              backgroundColor: `${
                question?.shape === "rounded" && question?.isColored
                  ? defaultColors[colorIndex][elem.value - startIndex]
                  : question?.isColored === "boolean" && !question?.isColored
                  ? "#fafafa"
                  : ""
              }`,
              color: `${question?.isColored ? "#fafafa" : "#000000"}`,
            }}
          >
            <span style={{ width: "100%", cursor: "pointer", margin: "0" }}>
              1
            </span>
          </a>
        </p>
      </td>