图标换行错位？lh 单位完美对齐

Better Icon and Label Alignment

列表中的图标在单行文本时居中完美，一旦文字换行，图标位置就会显得怪异。我曾尝试用 align-items: start 配合固定像素值的 transform 来修复，却发现图标大小或字体一变，对齐就失效了。最终，我利用 lh 单位结合 calc() 函数，计算出动态偏移量，让图标始终与文本首行顶部对齐。文章还深入探讨了使用伪元素作为图标时，如何通过 aspect-ratio 和 flex-shrink 避免图标被裁剪或变形。这套方案不依赖固定数值，能灵活应对各种字体大小和容器宽度的变化，彻底解决对齐难题。