From 60d61cd5c6ba4b51ef7905aa6758d13c8ca82a27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E7=BF=94?= <xiangzhang1024@gmail.com>
Date: Thu, 23 Apr 2026 13:25:16 +0800
Subject: [PATCH] =?UTF-8?q?fix(breadcrumb):=20=E7=AC=AC9=E6=AC=A1=E5=B0=9D?=
 =?UTF-8?q?=E8=AF=95=20-=20=E5=BC=BA=E5=88=B6inline-flex=20+=20vertical-al?=
 =?UTF-8?q?ign:middle?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

新策略：不再依赖Tailwind工具类，直接用style属性强制控制
- nav: lineHeight=1 消除行高差异
- 所有元素: display:inline-flex + verticalAlign:middle
- SVG图标: display:block 防止inline布局干扰
---
 src/components/layout/breadcrumb.tsx | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/layout/breadcrumb.tsx b/src/components/layout/breadcrumb.tsx
index f62ad71..229d0ce 100644
--- a/src/components/layout/breadcrumb.tsx
+++ b/src/components/layout/breadcrumb.tsx
@@ -14,20 +14,26 @@ interface BreadcrumbProps {
 
 export function Breadcrumb({ items }: BreadcrumbProps) {
   return (
-    <nav aria-label="breadcrumb" className="flex items-center gap-1.5 text-xs md:text-sm text-[#5C5C5C] py-3 md:py-4">
+    <nav
+      aria-label="breadcrumb"
+      className="flex items-center gap-1 text-xs md:text-sm text-[#5C5C5C] py-3 md:py-4"
+      style={{ lineHeight: '1' }}
+    >
       <StaticLink
         href="/"
-        className="inline-flex hover:text-[#C41E3A] transition-colors"
+        className="hover:text-[#C41E3A] transition-colors align-middle"
         aria-label="返回首页"
+        style={{ display: 'inline-flex', verticalAlign: 'middle' }}
       >
-        <Home className="w-[14px] h-[14px]" />
+        <Home className="w-3.5 h-3.5" style={{ display: 'block', verticalAlign: 'middle' }} />
       </StaticLink>
       {items.map((item, index) => (
-        <span key={index} className="inline-flex items-center gap-0.5">
-          <ChevronRight className="w-3 h-3 text-[#CCCCCC] shrink-0" />
+        <span key={index} style={{ display: 'inline-flex', verticalAlign: 'middle', alignItems: 'center' }}>
+          <ChevronRight className="w-3 h-3 text-[#CCCCCC] shrink-0 mx-0.5" />
           <StaticLink
             href={item.href}
             className="hover:text-[#C41E3A] transition-colors"
+            style={{ verticalAlign: 'middle' }}
           >
             {item.label}
           </StaticLink>