How to make text overflow clip at the edge of parent widget's

I'm trying to make the a container with some text inside. If the text is overflow, then the remaining text is clipped at the edge of the container.

TextOverflow.visible and TextOverflow.clip seems to do the same effect, which is desired. It remove the words that overflow instead of slicing it at the edge.

My code:

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
          color: Colors.lightBlue,
          width: 200,
          child: const Text(
            "the quick brown fox jumped over the lazy dog.",
            maxLines: 1,
            overflow: TextOverflow.clip,
          ),
        ),
        const SizedBox(
          height: 4,
        ),
        Container(
          color: Colors.lightBlue,
          width: 200,
          child: const Text(
            "the quick brown fox jumped over the lazy dog.",
            maxLines: 1,
            overflow: TextOverflow.visible,
          ),
        ),
      ],
    ),
  );
}

Result:

The container have some trailing space, enough to fit half the word "over" but it remove the whole word instead.

Expected:

softWrap: false to and remove overflow work perfectly. Credit to @DroidFlutter, thanks!

Container(
  color: Colors.lightBlue,
  width: 200,
  child: const Text(
    "the quick brown fox jumped over the lazy dog.",
    softWrap: false,
  ),
)