德语/法语站点长度适配：译文更长导致布局错位

引言：德文把按钮撑爆了

德语以”长词长句”著称（如 “Geschäftsbedingungen”），法文也偏长。英文设计稿的按钮/导航在德文下溢出换行，布局破。多语言必须考虑”最长语言”余量。

原理分析：为什么长

德语复合词、法语绕弯表达，译文长度常 +20~35%。固定宽容器（按钮、卡片标题）会被撑破或难看换行。应对：弹性布局 + 留余量 + 必要时精简译法。

保姆级实操

用弹性盒与文本处理：

.btn { white-space:normal; overflow-wrap:anywhere; max-width:100%; }
.card__title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

翻译时要求译员”在德文允许范围内精简”，避免超长。导航用图标+短标签。

常见坑

1. 固定宽按钮，德文溢出。
2. 不测最长语言，上线才破。
3. 案例：某站导航德文换行两行错位，改弹性 + 译员精简后整齐。
4. line-clamp 没设，卡片标题撑高。
5. 表格列固定宽，德文挤压。

总结

判断标准：以最长语言（德/法）测布局、弹性容器、必要时精简。行动清单：弹性布局 → 留余量 → 文本截断 → 译员精简 → 测德法。详见多语言 URL 结构对比。