Hey everyone! I've built a website that I really like, but I'm trying to make it so that the design stays locked when users zoom out in their browsers (like Chrome, Firefox, Safari, and Edge). I've mostly used pixel values in my CSS, with a touch of vh for certain elements like the 404 page and a section with some GSAP animations. Currently, I have a solution that works in Chrome, which involves some specific CSS and JavaScript settings. However, I'm struggling to get the same functionality in Firefox and Safari, and when I refresh the page, the layout gets messed up again. A friend of mine mentioned that my website should be fluid, but I'm not sure how to achieve that kind of responsive design. I've seen a couple of examples (like coinband.io and csullagoadosingleses.com.br) that seem to handle this perfectly. Can anyone share some advice or resources to help me get my website to maintain a consistent design during zooming? Thanks!
3 Answers
Your code looks pretty outdated and clunky. You should definitely take some time to learn more about JavaScript and modern CSS practices. Relying on outdated methods can hurt your performance a lot. I recommend diving into some tutorials and books to really grasp the fundamentals before trying complex stuff.
Just a heads up, but locking the zoom level isn't generally a great idea. Many users depend on browser zoom for accessibility. Maybe instead focus on making your site fluid with responsive design techniques instead of trying to lock it down?
Honestly, are you really worried about users zooming on your site? Most users just adapt their screens without bothering about it. But if you want to keep the design consistent, I suggest you post your code on something like CodePen or JSFiddle for better feedback. It helps you get more targeted advice.
Yeah, I'm focusing on having a design similar to those sites I mentioned. I just want to ensure it behaves consistently when zooming in or out.
I get that, but I still want to learn how to achieve that fluid design. If you can share how it's done, I’d appreciate it! Just want to enhance my skills.