harden

Use text-overflow: ellipsis with overflow: hidden for single-line truncation, or -webkit-line-clamp for multi-line clamping. Set min-width: 0 on flex and grid items so they can shrink below content size, and use overflow-wrap: break-word for wrapping.

Use CSS logical properties like margin-inline-start and padding-inline instead of physical left/right properties. Test with Arabic or Hebrew content, and mirror directional icons using transform: scaleX(-1) under the dir="rtl" attribute.

Handle 400 with validation messages, 401 by redirecting to login, 403 with a permission error, 404 with a not-found state, 429 with a rate limit message, and 500 with a generic error plus retry option. Each status needs a distinct user-facing response.

Disable the submit button while the request is in flight and use optimistic updates with rollback for concurrent operations. This prevents race conditions when users click submit rapidly or retry after timeouts.

German text is often 30% longer than English, so fixed-width containers overflow. Use flexible layouts with padding instead of fixed widths, flexbox or grid that adapts to content, and budget 30-40% extra space for translations.

No, client-side validation alone is insufficient. Always validate and sanitize inputs server-side as well, since client checks can be bypassed, and add rate limiting to protect against injection attacks and abuse.