Welcome! This kind of browser inconsistency is pretty common, so you’re definitely not alone.

Since it works in Google Chrome but breaks in Opera, it’s likely a CSS compatibility issue rather than your overall layout approach. A few things you can check before rewriting everything:

Vendor compatibility: Make sure you’re not relying on browser-specific behavior. Try adding proper fallbacks or prefixes (e.g., for flexbox/grid).
CSS Grid/Flex issues: Opera usually supports modern CSS, but small differences (like min-width, overflow, or flex alignment) can cause elements to shift or disappear.
Missing prefixes: Use a tool like Autoprefixer to ensure cross-browser support.
Box sizing & resets: Inconsistent defaults can break layouts—try applying box-sizing: border-box; globally.
Inspect in Opera DevTools: Compare computed styles between Chrome and Opera to spot what’s being ignored or overridden.
Check for unsupported properties: Especially newer CSS features that may behave slightly differently.

Before rebuilding your layout, I’d strongly recommend debugging with dev tools—you’ll usually find it’s just one or two CSS rules causing the issue