How to use details/summary tag as an accordion
Here’s a quick trick to display content as accordions on mobile but as static content on desktop, using the details html tag. Read more
06 August 2023 css html javascript
Here’s a quick trick to display content as accordions on mobile but as static content on desktop, using the details html tag. Read more
06 August 2023 css html javascript
Once a year, there comes a time when I get bored of using my usual code editor and like to try something new. This time it was Panic’s Nova code editor. Read more
14 July 2023 css html web design
blogs.windows.com
If you’re a web developer, you may have already heard that some CSS selectors are faster than others. In this article by Microsoft, they explain how to optimise CSS better by improving CSS selector performance. A must-read if you are working on Google’s Core Web Vitals. Read more
15 February 2023 core web vitals css website performance
www.smashingmagazine.com
I totally agree with this article. It’s all too easy for developers to reach for UI frameworks like Bootstrap with the hope of saving time, but it’s never the case. I’ve used a UI framework twice in my 20+ year career, and all it gave me was a headache and unnecessary website bloat. Read more
04 May 2022 css frameworks ui design
Drop caps have been used in printed media for a long time to add styling to the first letter of the first paragraph of piece of content. Read more
03 October 2021 css liquid shopify shopify-tips
css-tricks.com
I’m not sure why anybody, developer or not, would want to turn off/hide scrollbars on a desktop. This macOS setting has always puzzled me. Read more
I’ve been using Sass for a few years now, and I’ve gotten so used to using it on new projects, I never gave it a second thought. I thought it was making my life easier, but it’s caused me more hassle than it’s worth in recent weeks. Read more
16 July 2021 css sass web design
css-tricks.com
A brilliant post about how important HTML and CSS truly are today more than ever. I’ve been watching the JS and React craziness going on over the last few years and have refused to take part. The fundamentals of the web are, and always will be, HTML and CSS. Without these at the core, JS, React, or even PHP (or any other web-based language for that matter) would not even exist. Read more
The paragraph you are reading right now is styled differently from the rest of the paragraphs down below. This only applies if there are more sibling paragraphs below. Read more
09 May 2021 css
In my previous post, I mentioned that I’d added an archive page containing images of old work to my website. To build this, I decided to use CSS columns to create a masonry-style layout without using complex JavaScript or frameworks - just plain old CSS and HTML. Read more
06 May 2021 css page speed
joshwcomeau.com
Interesting idea on creating full-bleed layouts using css grid - not something I ever thought off using for this type of layout, but definitely a great idea! Read more
13 October 2020 css css grid web design
css-tricks.com
A great article about using flex-basis and flex-wrap instead of media queries when creating components. Read more
10 September 2020 css responsive web design
youtu.be
I’ve used min() and max() in CSS many times, but I wasn’t aware of clamp(), which looks amazing for typography! This youtube video by Kevin Powell shows a great example of them in use. Read more
16 May 2020 css responsive typography
I love the new desktop design of Gmail but I find the font size of the message composition window to be too small. Amazingly Google hasn’t added any options to change the font size other than providing the default “small”, “normal” and “large” (which is too large) choices. Read more
30 June 2018 css
HTML5 introduced the new range form element that is perfect for creating sliders with min and max values. Read more
codepen.io
There’s over 100 CSS colour names, most of which are unknown. You can find all of them here. Read more