Don’t use IDs in CSS

In CSS, you can assign styles to elements in 3 ways: either by a direct reference to an HTML tag, or by a class attribute, or finally, by the id attribute. Each of these approaches has it’s pros and cons, but in this article, I’ll highlight why you should avoid using styling by #id. In fact, you shouldn’t base your style design on id attributes at all.

5 tips on being smart with HTML and CSS

Remember — always code your site in the most simple and flexible manner. Once you’ve designed and developed your website, and put it online, you can be quite proud of yourself. However, when you come back later to make some changes or improvements, you can discover, to your surprise, that you would spend less time making it all over again, than just updating the current code. Either way, it’s just waste of time and brains. Here are some small tips that may save you lots of time in the future.

Rounded edges on links with pure CSS

Last time I showed how to make reusable rounded edges on block elements. It was a very effective technique, but it had some HTML overhead. Today, I will show how to make rounded edges on any elements using just CSS. Just like my rounded link highlights. But it can be extended onto list elements, headlines and actually, any other element that can be partially block.

Reusable rounded edges using CSS and HTML

Rounded edges are the trend now, everything has to be smooth and slick — and rounded. There are various techniques to achieve rounded edges. Today, as well as in an upcoming articles, I will describe some that are lazy enough that you should bother using them.

Simple yet perfect 2 column layout

Your probably have seen the Matthew James Taylor perfect liquid layouts. They are really good and I recommend them, but sometimes they are just overcomplicated for the task. This blog template uses a simplified version of 2 column layout that I came up with while working on it. It’s lazy compatible and here’s how it looks like.

Be smart with your CSS

Whether you agree or not, Cascading Style Sheets have become one of the key elements of modern websites. HTML was said to be just a container, possibly semantically organized, for your data. In fact, some people would love to see HTML be like XML, and I am one of them. The distinction between raw data (XML) and presentation layer (XSLT) gives you flexibility and makes data display simple. But for starters, it’s like shooting a fly with a canon. So take good care of your CSS, or you’ll end up in a big mess of data and styling. Here’s one idea I came up with while making this blog.