The effect below is what we are aiming for: In order to do this, you need three properties – background-image with a linear-gradient, background-clip with a value of text, and color of transparent. This works in IE9 and up but … Read More »
I’m reading an interesting book about interface animation by Val Head – Designing Interface Animation. Although animation has been considered a problem due to it’s overuse in annoying Flash ads, in this book Val explains that animation has some good … Read More »
In this trick, you use a hidden checkbox to transform the standard hamburger icon into an “X” on click. You start with some simple HTML with a checkbox that will be hidden before the toggle button. Within the label associated … Read More »
Here’s how to create custom designed radio buttons that work using only CSS.
I learned a neat technique to move the placeholder in an input field below it when the input field receives focus. That way the placeholder is visible as a label even when your user starts typing in the field. This … Read More »
Welcome to the latest iteration of my blog, where I will post about web development and design. I am currently interested in Angular and React and am working through a course on advanced CSS techniques. Here are some resources I … Read More »
I recently learned you can stack the invalid pseudo-class on top of the focus pseudo-class to easily mark a field as invalid. To do this, simply chain :invalid after :focus in your CSS, like so: In this case I also … Read More »