Text som lade sig ovanpå text — och kontrollen som inte såg det
Etiketten AUTHENTICATION är bredare än 96 px och kan inte brytas. Den staplade mobilformen gav den `w-[96px]`, så texten rann ut ur sin ruta medan värdet började vid 96 px. Bokstäverna hamnade ovanpå varandra. `min-w` låter korta etiketter hålla kolumnen och långa knuffa värdet till nästa rad i stället. Det allvarligare var att breddmätningen i genomgången inte kunde ha hittat det här: överspill gör inte dokumentet bredare. Ett första försök att jämföra elementens rutor rapporterade noll krockar med felet återinlagt — rutorna skar aldrig varandra, bara bokstäverna gjorde det. Mätningen jämför därför nu elementets textbredd med dess egen ruta, och görs över portalens åtta vyer i telefonbredd. Bevisad: med `w-[96px]` återinlagt faller genomgången med exitkod 1 och pekar på kunskapskällor och Authentication. Med `min-w` grön igen. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_012EQg3rJsrQ1ZNTvkzmQAtt
This commit is contained in:
@@ -393,8 +393,14 @@ export function Tabell({ kolumner, rader }: { kolumner: string[]; rader: ReactNo
|
||||
>
|
||||
{rad.map((cell, j) => (
|
||||
<div key={j} className="mt-2 flex flex-wrap items-baseline gap-2 first:mt-0">
|
||||
{/* `min-w` och inte `w`: en etikett som AUTHENTICATION är
|
||||
bredare än 96 px och kan inte brytas, så en fast bredd
|
||||
fick den att spilla ut ur sin ruta och lägga sig ovanpå
|
||||
värdet. Med en minimibredd håller korta etiketter
|
||||
kolumnen, och långa knuffar i stället värdet till nästa
|
||||
rad — behållaren bryter redan. */}
|
||||
<dt
|
||||
className="w-[96px] shrink-0 text-[11px] font-semibold uppercase tracking-[0.08em]"
|
||||
className="min-w-[96px] shrink-0 text-[11px] font-semibold uppercase tracking-[0.08em]"
|
||||
style={{ color: FARG.steel }}
|
||||
>
|
||||
{kolumner[j]}
|
||||
|
||||
Reference in New Issue
Block a user