Here are some nice links that we’ve gathered for you this week (thanks to @Pullo and @Paul_O_B for their suggestions):
News
- Before you get too excited about the CSS Level 4 "parent selector" (or the “subject indicator” as it’s actually called), there are actually two Selectors 4 profiles, known as “[URL=“http://dev.w3.org/csswg/selectors4/#fast-profile”]fast” and “[URL=“http://dev.w3.org/csswg/selectors4/#complete-profile”]complete”. Those listed in the complete profile [B]can only be used in JavaScript[/B]. Lea Verou points out (in her [URL=“http://5by5.tv/webahead/58”]The Web Ahead interview, Episode 58—about 32 minutes in) that browser makers are not keen to implement the parent selector (for performance reasons) and it has thus been relegated to the “complete” profile … meaning that it will never be usable except with JS.
- Via @Norman Paschke: did you know that [URL=“http://caniuse.com/#search=calc”]calc() and [URL=“http://caniuse.com/#feat=pointer-events”]pointer-events are now supported by all major browsers?
Articles & Videos
- Lea Verou argues that CSS is for developers.
- This year’s 24Ways is presenting some nice articles (as usual), including this one on The Responsive Hover Paradigm.
- Ryan Seddon shows how Flexbox can make CSS awesome again
- Watch a short video that demonstrates upcoming Firefox support for CSS Variables.
- Still not convinced (like me) that CSS preprocessing is for you? Perhaps An Event Apart: Preprocessing is for Everybody will change your mind.
- In An Event Apart: Universal Typography, Luke W (no, I can’t be bothered checking the spelling of his name) lists some handy points relevant to typography on the web.
- Andrew Clarke’s take on The Guardian’s take on Mobile-first Responsive Web Design and IE8.
- How to Design Animated Sliding Page Elements With CSS.
- Chris Coyier presents Line Menu Icon… That Is A Menu.
Resources
- Here is a handy list of CSS snippets for aligning and sizing elements on your pages.
- If basic mathematics is not your thing, or your desktop calculator is too hard to find, or your handheld calculator is just out of arm’s reach and it hurts your beer gut to lean into the desk and reach for it, you might enjoy this neat little CodePen Simple PX to EMs Converter.
- PPK provides a quick overview of the viewport-related concepts in the mobile browsers, which you may find handy.
- Do you use any of the “The top 25 responsive design tools”?
- 50 CSS Tools & Resources from 2013.
Demos
- A cool falling snow demo.
- Experiments on making :focus more visible for keyboard users.
- 3D Box Link Buttons.
A bit of cheek
And once again, some lighthearted tips for the week, courtesy of @H9RBSjs …
Hey, someone should build a tool to test responsive design breakpoints. Because resizing the browser window is just too much work.
<BODY><CENTER><TABLE><TR><TD><IMG SRC=spacer.gif></TD></TR><TR><TD ID=“footer”>© 1999</TD></TR></TABLE></CENTER></BODY>
[rule=100%]orange[/rule]
Take a look at any or all of the links above and tell us what you think! And feel free to PM me if you have an great links for the next issue.
You can also view a list of previous posts here.