Media Queries for Input Devices

What: Since not every touch enabled device is a handheld device, checking for size and checking for touch should be handled separately, since the changes to the design and functionality they require are not the same.

How: You can use media queries.

Read more


What: CSS-Tricks just posted about this last Friday and since I could have used this that day (!) but didn’t find it until now, I’m adding a note here for myself:

You have a page with a table of contents (with links), or you have a one page website with in-page navigation and you have a fixed header — when you click a link the content scrolls up too far and is hidden by the fixed header. This is not a good user experience, and you can improve it with scroll-margin-top in Firefox and Chrome-based browsers…

Read more

Auto Sizing Font-sizes

What: Changing the font-size and the line-height based on the width of the viewport but without using media queries, to create a smoother experience (with less work).

Read more

Styling placeholder text

Not something new I learned, more something I keep forgetting over and over.

::placeholder to change how placeholders look. You’d think I’d remember something so obvious…
If it’s not working, this post over at CSS-Tricks may have some more information on why.

(Actually, what that post taught me, is that there is a difference between pseudo elements and pseudo classes!)