Is there a single HTML5, JavaScript, and CSS debugger?

Question

I know that there is a varity of HTML5 debuggers (such as in Dreamweaver), a vareity of JavaScript (such as JSLint), and CSS debuggers (such as Firebug), but is there a sing

Answer 1

• Firebug for Firefox http://getfirebug.com/
• Developer tools for IE8 http://blogs.msdn.com/b/ie/archive/2008/03/07/improved-productivity-through-internet-explorer-8-developer-tools.aspx
• Chrome Developer tools http://code.google.com/chrome/devtools/

They all let you debug JS, examine CSS and HTML, and they are all free.

I prefer those over IDE built-in debuggers since they are usually implemented using firefox and you're out of luck if you have a webkit/IE problem. Maybe one day, IDEs will let you debug using any browser, until then, I use the IDE just for editing the code. Yeah, I know, not nearly as integrated, but that's all we have for now.

Answer 2

You might like WebStorm from JetBrains. It's not free, but the fee is nominal.

Answer 3

Microsoft Visual Web Developer express could help with all of this functionality and is free.

Answer 4

I just released a tool that allows you to visualize your HTML / CSS layout just by moving the mouse. It doesn't do it all, but its easy and its great for viewing layout problems.

HTML Box Visualizer - GitHub

Answer 5

In Google Chrome you can just right click, Inspect Element and then click

Answer 6

For stuff like this I just use the built in tools in Chrome, or Firebug in Firefox if you swing that way. This is very handy for debugging JS and CSS, not sure about HTML5 though.