Search

Nalezeno "pseudo": 21

I Played The Next Promising Soulslike So You Don’t Have To

10.3.2023
I’m a sucker for melee-focused games. Anything that emphasizes brutal brawling and flashy martial arts, like Sleeping Dogs and Sifu, is totally my jam. So, I was both curious and stoked when my Xbox Series S, the bestie that it is, recommended I check out ACE Team’s Clash: Artifacts of Chaos....

Creating Animated, Clickable Cards With the :has() Relational Pseudo Class

25.10.2022
The CSS :has() pseudo class is rolling out in many browsers with Chrome and Safari already fully supporting it. It’s often referred to it as “the parent selector” — as in, we can select style a parent element from a … Creating Animated, Clickable Cards With the :has() Relational Pseudo Class...

Single Element Loaders: The Bars

24.6.2022
We’ve looked at spinners. We’ve looked at dots. Now we’re going to tackle another common pattern for loaders: bars. And we’re going to do the same thing in this third article of the series as we have the others … Single Element Loaders: The Bars originally published on CSS-Tricks. You should...

Conditionally Styling Selected Elements in a Grid Container

15.6.2022
Calendars, shopping carts, galleries, file explorers, and online libraries are some situations where selectable items are shown in grids (i.e. square lattices). You know, even those security checks that ask you to select all images with crosswalks or whatever. 🧐… Conditionally...

CSS Pseudo Commas

30.8.2021
A bonafide CSS trick if there ever was one! @ShadowShahriar created a CodePen demo that uses pseudo-elements to place commas between list items that are displayed inline, and the result is a natural-looking complete sentence with proper punctuation. CodePen Embed… The post CSS Pseudo Commas...

Chromium spelling and grammar features

29.6.2021
Delan Azabani digs into the (hopefully) coming soon ::spelling-error and ::grammar-error pseudo selectors in CSS. Design control is always nice. Hey, if we can style scrollbars and style selected text, why not this? The squiggly lines that indicate...

:nth-child Between Two Fixed Indexes

29.6.2021
I needed to select some elements between two fixed indexes the other day — like literally the second through fifth elements. Ironically, I have a whole post on “Useful :nth-child Recipes” but this wasn’t one of them. The answer, it … The post :nth-child Between Two Fixed...

Custom State Pseudo-Classes in Chrome

6.5.2021
There is an increasing number of “custom” features on the web platform. We have custom properties (--my-property), custom elements (<my-element>), and custom events (new CustomEvent('myEvent')). At one point, we might even get custom media … The post Custom State Pseudo-Classes...

Did You Know About the :has CSS Selector?

17.3.2021
File this under stuff you don’t need to know just yet, but I think the :has CSS selector is going to have a big impact on how we write CSS in the future. In fact, if it ever ships in … The post Did You Know About the :has CSS Selector? appeared first on CSS-Tricks. You can support...

Bold on Hover… Without the Layout Shift

27.7.2020
When you change the font-weight of a font, the text will typically cause a bit of a layout shift. That’s because bold text is often larger and takes up more space. Sometimes that doesn’t matter, like a vertical stack of links where the wider/bolder text doesn’t push anything...

CSS :is() and :where() are coming to browsers

10.6.2020
Šime Vidas with the lowdown on what these pseudo-selectors are and why they will be useful: :is() is to reduce repetition¹ of parts of comma-separated selectors. :where() is the same, but nothing inside it affects specificity. The example of wrapping :where(:not()) is really great, as now there...

Pseudo-elements in the Web Animations API

14.5.2020
To use the Web Animations API (e.g. el.animate()) you need a reference to a DOM element to target. So, how do you use it on pseudo-elements, which don’t really offer a direct reference? Dan Wilson covers a (newish?) part of the API itself: const logo...

Pseudo Code

23.7.2019
Yonatan Doron wrote a post on Medium not long ago called "Art of Code — Why you should write more Pseudo Code." Love that title, as a fan of pseudo code myself. That is, writing "code" that describes something you want to do or communicate, but that isn't of any particular language and doesn't...

A Little Reminder That Pseudo Elements are Children, Kinda.

8.7.2019
Here's a container with some child elements: <div class="container"> <div>item</div> <div>item</div> <div>item</div> </div> If I do: .container::before { content: "x" } I'm essentially doing: <div class="container"> ...

Solved with CSS! Logical Styling Based on the Number of Given Elements

26.7.2018
This post is the third in a series about the power of CSS. Article Series: Colorizing SVG Backgrounds Dropdown Menus Logical Styling Based On the Number of Given Elements (this post) Did you know that CSS is Turing complete? Did you know that you can use it to do some pretty serious logical...

Nahoru
Tento web používá k poskytování služeb a analýze návštěvnosti soubory cookie. Používáním tohoto webu s tímto souhlasíte. Další informace