Diana Le articles - 20 total
Better Accessibility: My Path to the CPACC
I took the Certified Professional in Accessibility Core Competencies (CPACC) exam offered by the...
Use the new ARIA landmark <search> for search forms and filters
ARIA landmark roles are sections of a web site that are so important to the page that they warrant...
CSS Layouts: Get Started with Container Queries
Welcome to another year of the State of CSS. Like for last year's State of CSS 2022, I will be...
Are you an HTML expert? Find out with the new State of HTML 2023 survey
If you're familiar with the State of JavaScript or State of CSS surveys, there is now a brand new...
CSS Layouts: Maintain Element Proportions with aspect-ratio
Introduction Banner Example iframe Example Images Introduction There are times you'll...
CSS Typography: Create exact heights with line-clamp
I've built dozens of web sites, and by far one of the most common components that required multiple...
Simplify CSS selectors with :is() and :where()
Introduction How Both :is() and :where() Work How These Help Minimize Errors Specificity:...
CSS Selectors: Style lists with the ::marker pseudo-element
For HTML lists, there was no straightforward way to style the bullets a different color from the list...
CSS Selectors: Introduction to :has()
The functionality of CSS's new :has() selector has been something that I've wished existed natively...
State of CSS 2022 Survey
I always get a little excited each time the annual State of CSS survey rolls around because I can...
When did you create a Stack Overflow account?
It took me 9+ years to join Stack Overflow I've been using Stack Overflow as a resource...
Best Internet Explorer Troubleshooting Memories
In honor of IE retiring tomorrow June 15, let's talk about our best (or worst depending on your point...
Creating Squid Game's Dalgona Using Canvas
I've been a front-end web developer for a while and yet I've only used HTML5's canvas element 1-2...
CSS Layouts: History from Float to Flexbox and Grid
CSS layouts have changed significantly within the past several years due to flexbox and to grid. In...
Beginners Guide to Web Performance: Optimizing FontAwesome Icons
I'm a huge fan of font icons since they make updating or adding icons on the fly so much easier. I...
Create Mirrored Cursor Movement with CSS and JavaScript
This week's Codepen Challenge was "Reflections" so I created a pen where a light follows your cursor...
Add Some Bounce to your Forms with Animated Floating Labels
How to Style Form Labels like Placeholders Disclaimer: Forms with labels directly on top...
Beginners Guide to Web Performance: Optimizing Google Fonts
How to Improve Web Performance by Optimizing Google Fonts Use font-display:...
Animated Sky Using CSS Keyframes, Gradients and Transform
Animated Sky Using CSS Keyframes, Gradients and Transform This was a fun weekly Codepen...
Beginners Guide to Web Performance: Optimizing Images
How to Improve Web Performance and Site Speed by Optimizing Images Table of...