CSS question
i have these code blocks on my website. <pre> tags with <code> tags inside them. I'm currently looking at writing some CSS so they look nice, don't run off the edge of the page...
What I'm stuck on is, if I look at my website on my phone, all the text is much bigger. Great! Except. Text inside a <pre> tag is not bigger. It looks the same size as everything else on desktop, but really tiny in comparison on mobile.
I don't know what's making the text bigger on my phone, or how to ask it to make pre-formatted text bigger also. So if someone could point me in the right direction that would be great :)
re: CSS question
@noiob but. but my website wasn't being scaled, until i put this line in
there's this 'automatic font sizing' setting in firefox that, when i turned it off everything just got really small like on desktop, and no longer,
re: CSS question
@k4gi I mean "everything looks really small" sounds like scaling to me
re: CSS question
@k4gi it's the difference between "pretend your browser window is normal-sized, let zoom/font scaling solve it" and "just use the phone as a very narrow browser window, the website content will reflow to fit it" which doesn't work on most desktop-only layouts
@k4gi also idk what you're hosting this on but loading your site takes 32 seconds for me, which feels like a bit much for 60kB
@noiob lol maybe a dns thing, i was using the url for a different website until recently
@k4gi can't really be a dns thing since it's not the first load, I only disabled the browser cache
@noiob well i have no more ideas :) it's on a vps in sydney
@k4gi maybe just a slow route or sth
re: CSS question
@noiob i see i see, so the preformatted text wasn't being resized along with the rest of it because my browser assumed it wasn't designed to
re: CSS question
@k4gi also I am obligated to tell you that w3schools is one of the worst resources out there
https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_meta_tag