CSS：公交车站样式轴的两个问题
CSS: Two problems with Style axis of bus stops
[抱歉我的英语不好]
我必须显示巴士路线。
- 停靠站应按城市名称分组。
- 垂直线应连接所有停靠点圆圈。
结果应该是这个样子
这是我的尝试。 https://jsfiddle.net/xgL98h0w/2/
（代码是React，不过没关系）
我有两个问题：
城市名称（取决于它们的长度）未与边界对齐。例如，参见 "Long City Name".
我不知道如何用垂直线连接圆圈。我试图为每个圆圈添加 ::after 伪元素，但我没有成功使其工作。鉴于圆圈有 flex 显示，::after 伪元素未正确对齐。
感谢您的帮助！
谢谢提问！
城市名称（取决于它们的长度）与街区边界对齐。
用伪元素::after用竖线连接圆圈。 ::after 伪元素也正确对齐。
你来了！
https://jsfiddle.net/Kostandy/yvqb5rso/153/
希望对你有用！
[抱歉我的英语不好]
我必须显示巴士路线。
- 停靠站应按城市名称分组。
- 垂直线应连接所有停靠点圆圈。
结果应该是这个样子
这是我的尝试。 https://jsfiddle.net/xgL98h0w/2/ （代码是React，不过没关系）
我有两个问题：
城市名称（取决于它们的长度）未与边界对齐。例如，参见 "Long City Name".
我不知道如何用垂直线连接圆圈。我试图为每个圆圈添加
::after伪元素，但我没有成功使其工作。鉴于圆圈有flex显示，::after伪元素未正确对齐。
感谢您的帮助！
谢谢提问！
城市名称（取决于它们的长度）与街区边界对齐。
用伪元素::after用竖线连接圆圈。 ::after 伪元素也正确对齐。
你来了！
https://jsfiddle.net/Kostandy/yvqb5rso/153/
希望对你有用！