If it pops, it belongs in HTML and CSS! Lately, I had a lot of fun playing around with this upcoming feature. The first version is being developed and it’s starting to look pretty good. It’s time to handle our basic popovers without the explicit need of JavaScript.
Read more about Open UI and the Popover API
The :has() relational pseudo class has landed in Chrome and Safari and even though it gets less hype than for instance container queries, I believe this little pseudo class contains a lot of improvements to the way we write CSS today.
Read more about Practical uses of the :has() relational pseudo class
My first article for CSS-tricks on how to create a watch face with a conic gradient Using custom-properties and a little bit of Javascript.
Read more (CSS-tricks) about Making a Real-Time Clock With a Conic Gradient Face (CSS-tricks)
The world is full of frameworks and content management systems, we’re very spoiled when we want to create an application, but sometimes, you just need something static, simple and fast, so I created a Mini Static Thingy Wingy.
Read more about Introducing a Mini Static Thingy Wingy
Some HTML5 elements seem to have the tendency of not being picked up by developers. Although widely supported, we still seem to use collapses with the use of a JS library instead of using a native element. In this little post, I want to highlight the details element a bit.
Read more about The details element, collapsing content without the hassle
With Safari (15.4) being one of the last to implement the dialog element, a lot of browsers have great support for this element.. Goodbye to huge JavaScript libraries and welcome to the native HTML5 <dialog> element. This is beauty and simplicity on the web in its purest form. It’s accessible, customisable and most of all: easy to use.
Read more about A lot of power with little JavaScript, the HTML dialog element is here
Scroll snapping is hip and while we all have styled numerous sorts of tab panes and scroll boxes, I had an idea of combining them. What started out as a simple “scroll snapping experiment” turned out to be an accessibility study.
Read more about Using best practices to create CSS scroll snapping tabs
CSS grid is a lot of fun and I find myself using it far more often than I used to. Goodbye to the Flexbox grid and hello to all things grid. Here are some of the fun things you can do with the CSS grid module.
Read more about Fun things you can do with CSS Grid besides your basic layout
As we’re entering the last stages of 2021, I think it’s time to add a little wishlist for the future of the web. Since accessibility is getting more (deserved) notice. I thought that this year might be a good time for an HTML wishlist.
Read more about 5 future HTML tags on my wishlist that could benefit accessibility
There was a time when I was absolutely against every type of CSS library. The thought of using pre-defined class names gave me the shivers. Now, after working with them for some time, here are some of the thoughts on the matter.
Read more about Bootstrap & Tailwind: the current state of popular CSS libraries