Frontend Masters Boost RSS Feed https://frontendmasters.com/blog Helping Your Journey to Senior Developer Fri, 27 Dec 2024 19:05:54 +0000 en-US hourly 1 https://wordpress.org/?v=6.9 225069128 CSS text-box https://frontendmasters.com/blog/css-text-box/ https://frontendmasters.com/blog/css-text-box/#respond Fri, 27 Dec 2024 19:05:54 +0000 https://frontendmasters.com/blog/?p=4884 Safari is first to drop text-box in CSS, which plenty of people are excited for as it takes care of aligning text in many cases without the use of fragile magic numbers. They say:

Now you can declare which font metric you want the browser to consider the edge of the text box when calculating layout

Jason Bradberry has a wonderfully deep article and showcases one of the big use cases (non jacked up button centering).

Like Robin Rendle says:

I’m always fighting the text-box when it comes to buttons in an interface and so hopefully this property fixes all that.

Adam Argyle says:

This line of code is about to be in every single stylesheet.

h1, p, button {
  text-box: trim-both cap alphabetic;
}
]]> https://frontendmasters.com/blog/css-text-box/feed/ 0 4884