With all my work at bayt.com, I’d been think more about CSS architecture, how to write the qualified, meaningful, reusable classes.
So I want to share with you my secret of how to think and write the CSS, actually for me I found the fantastic way is the Lego way.
Because it’s like a bricks can be assembled and connected in many ways, to construct such objects/classes as vehicles, buildings, and even working robots.
For example, when I need to write a grid layout, I have a ready classes to do it so I don’t need to write any inline style, so I am just write an HTML tags and put the appropriate class(es), and another example also CSS sprite technique, I have built an image to put all major images/icons, check the following link:
so I am prepare class to handle all major positions of images so what I need when I put any image just the image-position.
And there is more and more layout pieces you can think it like this.
So my advice to all front end developer or web developer when he/she need to write any CSS to think it like a Lego, because it will save your time and make your process easier, and there is a CSS framework I recommend you to start with it ( Bootstrap ).
And don’t forget to make sure it’s tested on all major browsers.