How to do Simple Debugging in CSS

As a website developer/designer you must have good debugging skills in order to work done in time. Most of the language specific editors provides debugging features you can utilize them and solve your problems. But in CSS debugging is a bit different, let me show how to do simple debuggin in CSS.

Debugging is basically a process which involves finding and reducing of bugs, errors, flaws, defects, etc. Particularly talking about cascading style sheet language (CSS), many times you not get the expected results and you may want to know the space gathered by the particular element. There is a quick and dirty way to do so. You can temporarily set the border for that particular element with some width and highlighting color so it become prominent. For example:

1
.box {border:2px solid blue}

In this case the width of the element will increase 2 pixel to actual, you can manage it by reducing the element’s width accordingly.



Related posts

No Response

Post your response

Copyright © 2010 - 2014 Handy CSS Designed By Anotix, Powered By WordPress, all right reserved.