Div-itis

I think I’m recovering from div-itis. Let me explain.

When I first learned about designing sites the majority of people was still using tables. So I designed sites with tables. When I got introduced to layouts that didn’t use this approach I got interested. Some attempts followed to use a web-standards approach and after some frustration and going back to tables I finally took the plunge: divs were used to save the web from evil design.

I think that every little corner on a page I made was covered by a div. Every element that wasn’t a div was placed inside a div. I got to know css somewhat better, I became apt at placing divs, styling them, adding a margin or padding, etc. So it was easy to position certain elements just by placing them in a div and then styling that div so the elements inside were positioned as wanted. Positioning a list more to the left? Place it in a div and position that div to the left.

I still have a lot to learn when it comes to css (and other things too :-), but one thing I tried to avoid is div-itis. It takes some practice but the reward is cleaner code. No more div after div inside another div to position an element. I learned I can just as well position that element itself.

It’s a hard habbit to break and I can spot some example of that right on this site. But when I create a site I frequently ask myself: “Wait, can’t this element be styled on it’s own?” “Do I need to place it inside a div?”

If you suffer from div-itis, just like I did (and still do, sometimes), take a step back from time to time and ask yourself if some things can’t be done without a div. It does take more knowledge of other elements, and sometimes placing things inside a div can’t be avoided, but often it can. In the end it will be rewarding.