I nearly missed this article by Matthias Ott - The New CSS: Hear hear! Using graphic design / layout tools to 'design' user interfaces is a misconception. Those tools are wonderful to create artifacts to get into the discussion how a website may 'look', and to a lesser extend how it 'behaves'. But often those…
Manuel has completed his self-assigned challenge to post every day for 100 days something about "modern css", and today closes the series with a re-cap. Congrats, and thanks for doing this, Manuel. :-) There is so much I learned, new and old, and damn, look how far the "this is only for styling" thing has…
Here's my codepen around a neat and simple css grid 12 columns layout system I am currently testing / playing around with in different content management systems: It is all very brief and rough around the edges, but I am already stoked how the combination of inline-style css custom properties style="--span:6" and template-column: span var(--span)…
Hear hear! This great article about the craft of Frontend Development by Jens starts with a bang: Frontend development is a field that’s not unfamiliar with being misunderstood, and its value being underestimated or missed Oh yes. At first, FE was seen as some variation of Desktop Publishing. "Real" designers would ponder about the (visual)…
Yes, this seems to work*. O_o See the Pen Image with Background Image (yes you read that right) by Tom (@webrocker) on CodePen. I wondered if I could use a background image for a transparent png I used in a recent blog post, and decided to give it a try and not making a wrapper…
This morning, my timeline on Twitter was full of pictures and remarks about Tesla's new "Cybertruck" with the futuristic and plain look, brutal even. One of the first things that came to my under-coffeed mind then was "hm, this looks so angular, this was maybe designed with CSS?" As one does, a tweet followed: "css…
Jeremy Keith's talk at Beyond Tellerrand Berlin 2019 about the "layers of the web" (be sure to watch this!) inspired me to a quick css animation experiment on codepen: See the Pen Web Layers Of Pace by Tom (@webrocker) on CodePen. Be sure to look at it in the full screen mode, the thing currently…
Aside from the fact that Heydon and Andy have published a very interesting work regarding the art of (writing less) CSS "Every Layout" - and want to get paid for the value this will bring to your arsenal - this blog post is a very good read.
No, websites do not need to look exactly the same in every browser, but while styling a details/summary element recently, I thought I had found smart way to make the default "open/closed" markers behave visually a bit nicer without resorting to re-invent several wheels and hacking my way with "::before" contents: .acc-trigger { list-style-type: none;…
In a current project, the designer asked if we could add a little gimmick to the horizontal navigation, which consists of just a few one-level items. Of course the idea is visual-, desktop-, and mouse-input-device-centric, and a discussion about other devices and the resulting state of the navigation ensued, and we agreed to treat this…
Dedicated to all the people who work to make the web a little better every day […] a documentary film about the web […] It is the story of Tim Berners-Lee’s creation – how it came to be, where it’s been, and where it’s going – as told by the people who build it. vimeo.com…
Webrocker