...
All web-designers and developers should use the following developer browser extensions:
- Firefox: use the Developer Tools (see https://developer.mozilla.org/en-US/docs/Tools). They can even help you work with Sass: https://hacks.mozilla.org/2014/02/live-editing-sass-and-less-in-the-firefox-developer-tools/
- Firefox: alternatively, install Firebug (http://getfirebug.com/), a free extension for easy comparison and debugging between your CSS and the output.
- Firefox/Chrome: install the Web Developer (http://chrispederick.com/work/web-developer/), a free extension adds many handy web developer tools to your browser.
- Safari 5+: use the Web Inspector (see https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Introduction/Introduction.html).
- Chrome: use the Developer Tools (see https://developer.chrome.com/devtools/index).
- Opera 9.5+: use Dragonfly, a fully-featured debugging environment (see http://www.opera.com/dragonfly/).
- Internet Explorer 8+: use the Developer Tools (see http://msdn.microsoft.com/en-us/library/dd565628%28v=vs.85%29.aspx).
- Internet Explorer 6 and 7: install the IE Developer Toolbar (see http://www.microsoft.com/en-us/download/details.aspx?id=18359), or use Firebug Lite (see https://getfirebug.com/firebuglite).
...