Closed br0nstein closed 10 years ago
The base font is set in the body
block in the main.css
file. Your point about cross-browser compatibility is a good one, but not one that I think we can perfectly rectify. The main reason I set it as large as I did is to make it accessible and mobile-friendly---if the font is too big in a desktop browser, it can usually be easily reduced with a hotkey. But it's not as easy to adjust font-size on mobile devices.
Another reason for the different look across browsers is that the Google font "Oswald" shows up well in Firefox but looks extremely pixelated and ugly on Windows Chrome; fixing that required switching to "Georgia" for the sake of Windows users, but the only way to do that is to select Georgia for Safari users too …
As you can see, it's complicated!
Oh yeah, I don't know why I said that. It's set to 78% of the browser font size in body right? Well anyways the point about relative font sizes is kind of irrelevant..
Well it looks like you've thought about this more than I have so I'll yield to your reasoning.
If I've thought about it more, it's not necessarily because I wanted to! :-P
I've definitely pulled out more of my own hair about it! Just check out the commit message I wrote for this commit: ricedh/ricedh.github.io@bf3a1b949863935eba9a8f25599b4a7445ed356e.
Let's just say CSS wrangling is not for the faint of heart!
Haha yeah. CSS seems easy to get a good grasp on but difficult to work out all the kinks of cross-browser compatibility (esp. new features not being fully adopted). Not to mention different screen resolutions, mobile/desktop, and... Internet Explorer.
Does anyone else think the font on the website is too big? I know big fonts are the trend on the web nowadays on sites like Medium, etc and they are easier to read than 12pt, but I think the current font size overdoes it.
In my opinion, it looks better in Firefox than Safari/Chrome. Right now it's set to 1.5em but a base font size doesn't appear to be set, explaining why it appears a different size across the browsers.