From 0990b1b35e17dec5d8141feb63a24585f507b4f2 Mon Sep 17 00:00:00 2001
From: yiqiu <yiqiu@ycyaw.com>
Date: Wed, 17 Dec 2025 17:12:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=A7=BB=E5=8A=A8=E7=AB=AF?=
 =?UTF-8?q?=E6=B3=A8=E5=86=8C=E6=8C=89=E9=92=AE=E9=AB=98=E5=BA=A6=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98=20-=20=E6=B7=BB=E5=8A=A0=20height:=20100%=20=E5=88=B0?=
 =?UTF-8?q?=20nav-header=20.nav-right?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

深层根本原因分析：
之前修复使用了 align-items: stretch，但这只是 flexbox 的对齐属性，
并不能让 flex item 自动获得高度。关键问题是：

布局链条：
nav-header (height: 50px, display: flex, align-items: stretch)
  └─ nav-right (✗ 没有 height 设置)
     └─ no-login (height: 100% 但父元素是 0px)
        └─ registBtn (height: 100% 但父元素是 0px)

当 flex item 没有显式 height 且内容为 0px 时，即使使用
align-items: stretch 也会折叠到 0px。

修复方案：
1. 767px 断点 (line 2498-2501):
   添加 height: 100% 到 #index .nav-header .nav-right

2. 575px 断点 (line 3062-3065):
   改 align-items: center → stretch
   添加 height: 100%

3. 360px 断点 (line 3564-3567):
   已正确有 height: 100%

修复后的高度继承链：
nav-header: 50px
  └─ nav-right: 50px (100% of parent) ✅
     └─ no-login: 50px (100% of parent) ✅
        └─ registBtn: 50px (100% of parent) ✅

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 css/index.css | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/css/index.css b/css/index.css
index 0107441..43cd342 100644
--- a/css/index.css
+++ b/css/index.css
@@ -2498,6 +2498,7 @@ html {
   #index .nav-header .nav-right {
     display: flex;
     align-items: stretch;
+    height: 100%;
   }
 
   #index .nav-menu {
@@ -3060,7 +3061,8 @@ html {
 
   #index .nav-header .nav-right {
     display: flex;
-    align-items: center;
+    align-items: stretch;
+    height: 100%;
   }
 
   #index .nav-header .nav-left .nav-icon {