Cascading Style Sheets, designing for the Web – Chapter 3: The amazing em unit and other best practices
This is a chapter of the book Cascading Style Sheet – designing for the Web 3rd edition, by Håkon Wium Lie & Bert Bos (Addison-Wesley, 2005, ISBN 0321193121). This chapter is about writing style sheets with style. By showing you case studies and how they are constructed, we give you a sense of how CSS can encode the visual presentation you want to achieve. More importantly, if you follow the guidelines in this chapter, your documents will behave well on a wide range of Web devices. For example, they will scale gracefully from one screen size to another. The foremost tool for writing scalable style sheets is the em unit, and it therefore goes on top of the list of guidelines that we compile throughout this chapter: Use ems to make scalable style sheets! Use ems to make scalable style sheets. Named after the letter M, the em unit has a long-standing tradition in typography where it has been used to measure horizontal widths. For example, the long dash (—) often found in American texts i
This chapter is about writing style sheets with style. By showing you case studies and how they are constructed, we give you a sense of how CSS can encode the visual presentation you want to achieve. More importantly, if you follow the guidelines in this chapter, your documents will behave well on a wide range of Web devices. For example, they will scale gracefully from one screen size to another. The foremost tool for writing scalable style sheets is the em unit, and it therefore goes on top of the list of guidelines that we compile throughout this chapter: Use ems to make scalable style…
saved by
related reading
- font-size CSS property - CSS | MDNdeveloper.mozilla.org
- DESIGN.md Examples for AI Agents | Refero Stylesstyles.refero.design
- A Dao of Web Design – A List Apartalistapart.com
- Say precisely what you mean.index.how
- Web Field Manual | Codewebfieldmanual.com
- Typescale - Create stunning typography, generate CSS, and find inspiration.typescale.com
- Impeccable: The missing upgrade to Anthropic's impeccable skillimpeccable.style
- GitHub - andredesousa/css-best-practices: This is a guideline of CSS best practices that you can apply to your front-end project. · GitHubgithub.com
- Cheng Lou on X: "My dear front-end developers (and anyone who’s interested in the future of interfaces): I have crawled through depths of hell to bring you, for the foreseeable years, one of the more important foundational pieces of UI engineering (if not in implementation then certainly at https://t.co/BKnwCDIp75" / Xx.com
- The Design of This Websiteturntrout.com
- CSS Basic User Interface Module Level 3 (CSS3 UI)drafts.csswg.org
- Typography in ten minutes | Butterick’s Practical Typographypracticaltypography.com