紧急修复:为 nav-right 添加 flex-shrink 和 min-height 防止高度坍塌
问题根源: - 虽然设置了 align-items: stretch 和 height: 100%,但 nav-right 仍被计算为 0px - 原因是 flex 容器中的 nav-right 被隐式设置为 flex-shrink: 1(默认值),导致在计算时被压缩 - 同时缺少 min-height 导致可能的进一步坍塌 关键修复属性: - flex-shrink: 0 - 防止 flex 项在 nav-header 中被压缩 - min-height: 50px/48px/44px - 设置明确的最小高度作为备份(对应各断点的 nav-header 高度) 修改范围: 767px 断点(common.css + index.css): - .nav-header .nav-right 添加 flex-shrink: 0; min-height: 50px; - .nav-right 添加 flex-shrink: 0; min-height: 50px; 575px 断点(common.css + index.css): - 同上,但 min-height: 48px 360px 断点(index.css): - 同上,但 min-height: 44px 基础规则保持不变 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -2500,6 +2500,8 @@ html {
|
||||
align-items: stretch !important;
|
||||
height: 100% !important;
|
||||
flex-wrap: nowrap !important;
|
||||
flex-shrink: 0;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
||||
#index .nav-menu {
|
||||
@@ -2524,6 +2526,8 @@ html {
|
||||
justify-content: flex-end;
|
||||
gap: 6px;
|
||||
height: 100% !important;
|
||||
flex-shrink: 0;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
||||
#index .nav-right .nav-text-link {
|
||||
@@ -3064,6 +3068,8 @@ html {
|
||||
display: flex !important;
|
||||
align-items: stretch !important;
|
||||
height: 100% !important;
|
||||
flex-shrink: 0;
|
||||
min-height: 48px;
|
||||
}
|
||||
|
||||
#index .nav-header .nav-left .nav-icon {
|
||||
@@ -3083,6 +3089,8 @@ html {
|
||||
justify-content: flex-end;
|
||||
gap: 4px;
|
||||
height: 100% !important;
|
||||
flex-shrink: 0;
|
||||
min-height: 48px;
|
||||
}
|
||||
|
||||
#index .nav-right .nav-text-link {
|
||||
@@ -3568,6 +3576,8 @@ html {
|
||||
display: flex !important;
|
||||
align-items: stretch !important;
|
||||
height: 100% !important;
|
||||
flex-shrink: 0;
|
||||
min-height: 44px;
|
||||
}
|
||||
|
||||
#index .nav-header .nav-left .nav-icon {
|
||||
@@ -3595,6 +3605,8 @@ html {
|
||||
justify-content: flex-end;
|
||||
gap: 4px;
|
||||
height: 100% !important;
|
||||
flex-shrink: 0;
|
||||
min-height: 44px;
|
||||
}
|
||||
|
||||
/* 移动端隐藏登录按钮和分隔符,只显示注册按钮 */
|
||||
|
||||
Reference in New Issue
Block a user