CSS math isn’t just about how things look! It can also be used to work out useful numeric information. For instance, you could calculate and show the percentage of tasks completed in a to-do list with CSS, helping users keep track of their progress. No need for script or server computation. No latency. No use […]
Computing and Displaying Discounted Prices in CSS Read More »
The CSS rotateX() function rotates an element around the x-axis in a three-dimensional space. Specifically, it vertically flips the element, making it tilt backward or forward, depending on the angle set. It is one of many transform functions used in the transform property. The x-axis is the axis of rotation, so the element turns vertically. Imagine a pin is
The CSS rotateY() function rotates an element around its vertical y-axis. Specifically, it horizontally flips an element from left to right (or right to left for that matter). It is one of many transform functions used along with the transform property. The y-axis is the axis of rotation, so the element turns horizontally. Imagine a pin is stuck to
The CSS rotateZ() function rotates an element around its z-axis, so clockwise or counterclockwise. While it produces the same visual effect as the rotate() function, it’s best used in 3D transformations. It is one of many transform functions used along with the transform property. CodePen Embed Fallback In the demo, we first set up a stage for our 3D element with perspective.
The CSS rotate() function spins an element either clockwise or counterclockwise in a 2D plane. It is one of many transform functions used in the transform property. For example, using rotate() we can rotate the hand around the clock: .seconds-hand { transform: rotate(var(–deg)); transform-origin: bottom center; } CodePen Embed Fallback For rotating elements tri-dimensionally, consider using rotateX() and rotateY(). The rotate() functions is defined
In the first part of this series, we talked about the Decision Node Audit. We mapped out the internal workings of our AI system to pinpoint the exact moments it makes decisions based on probabilities. This told us when the system needs to be transparent with the user. Now, the big question is how to
Practical Interface Patterns For AI Transparency (Part 2) Read More »
It’s gonna be tough to keep it together on this one. Okay. I got this. I am a professional technical writer. Straight face; all-business. Ahem: if you’ve been following the ongoing work at TC39 (the standards body responsible for maintaining and developing the standards that inform JavaScript) you may have encountered some of their recent
Soon We Can Finally Banish JavaScript to the ShadowRealm Read More »
So, you build a data table with long rows, lots of columns, and horizontal scroll on the container. It works fine with a mouse and you ship it. But! When a keyboard user Tabs into the table, its focus lands on a cell. Then they press the arrow keys to read across the row but
Why Keyboard Users Can’t Scroll Your Overflow Containers Read More »
From a clunky grey box on a 1995 dial-up screen to the invisible, AI-driven “zero-click” purchases of 2026, the “Buy” button has evolved into a seamless biometric handshake. We’ve spent three decades systematically deleting the “friction of thought,” turning the entire physical world into a clickable, autonomous storefront.
The Evolution of the “Buy” Button: 1995–2026 Read More »
Comprehensive guide covering The Element: Stop Using JavaScript Dropdown Libraries with practical implementation details. Continue reading The Element: Stop Using JavaScript Dropdown Libraries on SitePoint.
The Element: Stop Using JavaScript Dropdown Libraries Read More »
