Frontend Masters Boost RSS Feed

https://frontendmasters.com/blog

Frontend Masters Boost is a blog about web development. It's written by the team at Frontend Masters, course instructors from the industry, and curated guest authors. The goal is to help you on your path to becoming a senior developer, or to be an even better one.

フィード

記事のアイキャッチ画像
The one-liner for max-width, centering, and margins.
Frontend Masters Boost RSS Feed
To horizontally center an element and limit it’s width, this is easily the most common approach: That could still touch the edges of a parent container though, so if need to enforce some spacing, we’d probably do that on a parent. There is no real problem with that, but we can smash it all into […]
1日前
記事のアイキャッチ画像
Using the Custom Highlight API
はてなブックマークアイコン 1
Frontend Masters Boost RSS Feed
You can get your hands on ranges of text in JavaScript, then apply a named "highlight" on them, so you can style that range in CSS with no other selector necessary.
3日前
記事のアイキャッチ画像
Get the number of auto-fit/auto-fill columns in CSS
はてなブックマークアイコン 1
Frontend Masters Boost RSS Feed
The whole point of auto-fit and auto-fill is that you aren't saying how many columns to use. But if you knew how many the browser chose, you can make nice design decisions.
4日前
記事のアイキャッチ画像
Little Reminder About Custom Properties with Invalid Values
Frontend Masters Boost RSS Feed
This is like one of those weirdly difficult quizzes about CSS. If you’ve got a <p> element sitting there in a totally normal basic HTML layout, then this CSS: What color does the <p> render as? It’s blue. You might think it’s green, as the value blah is an invalid color. If the CSS had… […]
4日前
記事のアイキャッチ画像
Infinite Marquee Animation using Modern CSS
はてなブックマークアイコン 1
Frontend Masters Boost RSS Feed
A row of logos that animate forever perfectly and don't have any duplicated HTML or JavaScript at all is quite a trick. Thanks modern CSS!
5日前
記事のアイキャッチ画像
Just a Semicolon
Frontend Masters Boost RSS Feed
A silly debate that rages just as hard as “tabs vs spaces” is “semicolons or not” in JavaScript. Generally, the answer is “use an automatic formatting tool so you don’t have to think about it”. But if you happen to be on the “no semicolons” side, it’s interesting to note that it can cause confusing […]
8日前
記事のアイキャッチ画像
Should we NEVER use non-logical properties?
はてなブックマークアイコン 1
Frontend Masters Boost RSS Feed
Best bet: just always use them.More nuanced take: there is a few situations where using the physical property is still releavant.
9日前
記事のアイキャッチ画像
Liquid Glass on the Web
はてなブックマークアイコン 2
Frontend Masters Boost RSS Feed
It's a complicated look! There may or may not be blurring, light refracts in tricky ways, the highlights are quite bright, and you've got to be very careful about text contrast accessibility.
12日前
記事のアイキャッチ画像
Fonts for Wireframing
Frontend Masters Boost RSS Feed
When you’re doing a design prototype, it’s common to use the actual fonts the design will use, but use “lorem ipsum” text. The idea being to not distract anyone with real words when they are supposed to be looking at the design. Or you just don’t have any real text to work with at that […]
16日前
記事のアイキャッチ画像
The Figcaption Problem
Frontend Masters Boost RSS Feed
When an image isn't "full width", but you want that caption underneath to wrap at the end of the image.
16日前