learning-rust / learning-rust.github.io

Rust Programming Language Tutorials for Everyone!
https://learning-rust.github.io
MIT License
1.48k stars 165 forks source link

Responsive issue on wide screen #67

Closed Elliot67 closed 9 months ago

Elliot67 commented 10 months ago

There is some responsive issue when the window is larger than 2560px. If you don't have a wide screen, you can debug that with the "simulator mode" at 50% scale.

https://github.com/learning-rust/learning-rust.github.io/assets/45725915/31c2d408-1c8c-4ace-95de-a0be628e1376

dumindu commented 9 months ago

Thanks for reporting this. Last time I tested mostly on Safari and Firefox. Surprisingly, no issue on Safari and Firefox even now, even with zoom on FF. Also, it looks like css zoom implementation on Safari and Chrome quite buggy(ex: list items line height) as FF devs tells.

💡 Test page: https://learning-rust.github.io/docs/why-rust/

Safari Screenshot 2023-11-27 at 10 05 55 PM-min

Firefox Screenshot 2023-11-27 at 10 07 49 PM-min

Chrome 🐛 QUD Screenshot 2023-11-27 at 10 06 05 PM-min UHD Screenshot 2023-11-27 at 10 06 26 PM-min

Screenshot 2023-11-27 at 10 12 21 PM

Let me check about what's the issue first.

dumindu commented 9 months ago

@Elliot67 I removed @media(min-width:2560px){body{zoom:1.2}}@media(min-width:3840px){body{zoom:1.6}}. It looks this issue also linked with the browser's malfunctioning zoom implementation. Kindly help me to verify. Thanks

Elliot67 commented 9 months ago

@dumindu Yep, the sidebar size is correct now :)

Didn't know about the zoom property, but it doesn't look like a property anyone would want.