diff --git a/packages/ui/src/Field.recipe.ts b/packages/ui/src/Field.recipe.ts
index 97e7a39..d39fbe9 100644
--- a/packages/ui/src/Field.recipe.ts
+++ b/packages/ui/src/Field.recipe.ts
@@ -97,7 +97,11 @@ export const field = defineSlotRecipe({
           // their own line below the label/control pair.
           flexWrap: "wrap",
         },
-        label: { mb: "0", flex: "1 1 auto" },
+        // Basis 0, not auto: the wrap container breaks lines on hypothetical
+        // sizes, and an auto basis is the label's max-content — a long
+        // translated label would push the control onto its own line instead
+        // of wrapping its text beside it.
+        label: { mb: "0", flex: "1 1 0" },
         helperText: { width: "100%" },
         errorMessage: { width: "100%" },
       },
diff --git a/packages/ui/stories/FieldChrome.stories.tsx b/packages/ui/stories/FieldChrome.stories.tsx
index bd4f94d..975cd46 100644
--- a/packages/ui/stories/FieldChrome.stories.tsx
+++ b/packages/ui/stories/FieldChrome.stories.tsx
@@ -220,6 +220,16 @@ export const SideLabels: Story = {
         >
           {options}
         </Select>
+        {/* Translation-length label: must wrap beside the control, not push
+            it onto its own line (the label's flex basis is 0 for this). */}
+        <Select
+          label="Highlight code structure when the translation runs long"
+          labelPosition="side"
+          defaultSelectedKey="Apple"
+          triggerCss={{ width: "28ch" }}
+        >
+          {options}
+        </Select>
         <ComboBox
           label="Preferred fruit"
           labelPosition="side"