Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Don't use "px" as font size unit #203

Closed
StefanoD opened this issue Feb 12, 2017 · 4 comments · Fixed by #894
Closed

Don't use "px" as font size unit #203

StefanoD opened this issue Feb 12, 2017 · 4 comments · Fixed by #894
Labels
A-Style Area: Style (CSS, etc.) C-enhancement Category: Enhancement or feature request E-Easy Experience: Easy S-Wishlist Status: Wishlist

Comments

@StefanoD
Copy link

Displays have different resolutions, so it is not recommended using px as font-size unit. It is better to use em or %.
i looked at the new book version of Rust Book and I could find one font-size declaration using px:

.menu-title {
  display: inline-block;
  font-weight: 200;
  font-size: 20px;
  //...
}

Maybe this was made on purpose, maybe not. I'm not really the web-dev guy. :)
@StefanoD StefanoD mentioned this issue Feb 12, 2017
Closed
@azerupi azerupi added the CSS label Feb 12, 2017
@azerupi
Copy link
Contributor

azerupi commented Feb 12, 2017

Yes, it would probably be better to use em units overall for font-size :)

@cbreeden
Copy link

Though I agree that setting font sizes for different emphasis should use a relative font unit (em, %), it should be noted that px is a resolution independent unit.

Converting css px_ to device pixels is determined by how far the screen should be from the user; phones are normally held closer than a desktop monitor, so a css px should be larger in absolute size on a desktop screen than on a phone screen so that they appear the same size when read from their respective distance.

@Anachron
Copy link

Anachron commented Mar 1, 2017

Actually one should use rem if changing from px at all. :)

@chrisportela
Copy link

Set a sensible root font size on the <body> and then use XX rem everywhere else. This makes changing fonts for mobile/tablet/laptop/4k easier because the @media tags can simply change the root font and everything adapts in proportion.

@azerupi azerupi added A-Style Area: Style (CSS, etc.) E-Easy Experience: Easy S-Wishlist Status: Wishlist C-enhancement Category: Enhancement or feature request and removed CSS labels May 16, 2017
@zbrox zbrox mentioned this issue Mar 28, 2019
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
A-Style Area: Style (CSS, etc.) C-enhancement Category: Enhancement or feature request E-Easy Experience: Easy S-Wishlist Status: Wishlist
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Use only relative font sizes zbrox/mdBook
5 participants
@chrisportela @Anachron @StefanoD @azerupi @cbreeden