Gawdy Borders Make CSS Design Easy
Turn on the borders when designing
How often do you get to use dotted red, dashed purple, solid green or yellow borders?
CSS Stylesheet
#header {border: 1px dotted red;}
#sidebar {border: 1px dashed purple;}
#content {border: 1px solid green;}
#footer {border: 1px solid yellow;}
I use them on most all new CSS layouts. Until I have a good feel for my layout, then poof! I make them disappear.
Adding borders to all your divs is a helpful trick when designing a CSS table-less web site. This helps you ’see’ what you are doing. It’s a great tool for those just coming over to CSS design from table design.
I’ve solved many a margin and padding issue with this trick as well. By applying a border to my divs, I’ve been able to see when divs where overlapping.