Get more control of the scroll bar with the proposed CSS scroll snap points feature
Popular UX paradigms for scrollable content frequently employ paging through content, or sectioning into logical divisions. This is especially true for touch interactions where it is quicker and easier for users to quickly pan through a flatly-arranged breadth of content rather than delving into a heirarchical structure through tap navigation. For example, it is easier for a user to view many photos in a photo album by panning through a photo slideshow view rather than tapping on individual photos in an album.
However, given the imprecise nature of scrolling inputs like touch panning and mousewheel scrolling, it is difficult for web developers to guarantee a well-controlled scrolling experience, in particular creating the effect of paging through content. For instance, it is easy for a user to land at an awkward scroll offset which leaves a page partially on-screen when panning.
Read the W3C proposal at: drafts.csswg.org
Have you ever wanted to use a particular CSS feature but didn’t because it wasn’t fully supported in all browsers?
Read more from the source: Smashing Magazine
I ran into an IE 9 – 11 bug last night that would have been fixed with a css reset and now I have more respect for normalize.css
What does it do?
- Preserves useful defaults, unlike many CSS resets.
- Normalizes styles for a wide range of elements.
- Corrects bugs and common browser inconsistencies.
- Improves usability with subtle modifications.
- Explains what code does using detailed comments.
Read more and download on GitHub
Use :before and :after pseudo-elements with an attr() expression to make broken images look snazzy
Broken images are ugly. But they don’t always have to be. We can use CSS to apply styles to the element to provide a better experience than the default. Two Facts About The Element To understand how we can style broken images, there
Read how at bitsofcode
Use flexbox to make tables responsive and flip columns with rows
David Bushell writes:
Four years ago I shared an idea to make tabular data responsive. Browser support was experimental and the workarounds were extremely hacky. I revisited the technique this week, cleaned it up, and I am pleased to say all modern browsers work perfectly.
Read more from dbushell.com
- Small file size. Only 1.5KB minified and gzipped!
- Easy to use. No config required.
- Works in all modern browsers.
Download at kushagragour.in