So to start off, I purchased the month long membership to the lodge. It’s a ton (around 190) videos of Chris Coyier re-designing CSS-Tricks and a newly added section of another site build. I am on video 75 of the time of this post, but learned a few neat tricks and better practices so far.
If you haven’t heard of SCSS or SASS, you should check it out. It is a pre processor for CSS, which pretty much boils down to a similar language of code that is easier to write, will save you time, and then builds it back into CSS for the web. Oh, and its minified.
It’s much easier to set up and utilize on a mac it seems, as it already has gem/ruby installed on OSX, however with Sublime text 2, fire.app(compass.app, or compass on the mac), and a plugin for ST2, you can be up and running in no time.
For me, I’ll be switching over to scss. I havent used it besides setting up some simple file structures for a boilerplate, but I already enjoy it a lot more. Especially the control over something as simple as organization. You can name a file _templatepartname.scss and simply @import “thatName”; to pull it together, while keeping them separate and neat and clean.
I have never really used to many pseudo elements before, besides the normal :hover, :active, etc.. However the :before and :after elements are supported in everything besides IE6-7. As I will be dropping support for IE7 and below (so far the highest numbers of users on these I could find were roughly 2% globally) this is something I want to use a lot more. It is a nice way to get more out of a single element on the page. It will also do things such as adding multiple backgrounds, without actually using multiple backgrounds on the same element. I should also note that I find it awesome that these two selectors can be given a height, width, and positioned absolutely. So make the parent relative and position them however you want!