I'd say just look at Chrome dev tools and copy them at this point. Debugging in Firefox is a mediocre experience IMHO. As for the name .html is unnecessary.
So, what does Chrome dev tools provide that current Firefox does not? I use Firefox because it's what I've always used (and I prefer the browser) and what I'm familiar with. What are the good reasons for me to learn the Chrome dev tools?
1) Speed. Chrome is blinking fast, Firefox, especially when fiddling with margins on CSS classes that are heavily used, is dog slow.
2) Compatibility with Webkit-based mobile browsers for debugging. I'm so not having two browsers with hundreds of MB of RAM usage open.
Firefox' advantage is, though, the mouse inspector - it shows rulers for the selected element at it's borders. Invaluable when trying to align text across columns or rows!
1. I haven't found Firefox to be "dog slow". I may not be doing things that stress it, but overall, speed is not something I have had complaints about.
2. Ummm...don't you have to test against non-WebKit browsers, anyway? Or, do you really expect all of your users to only use WebKit based browsers? That seems problematic.
> 2. Ummm...don't you have to test against non-WebKit browsers, anyway?
Testing in Chrome on OS X takes care about Chrome, Windows, Safari, Android, iOS (even though the iOS Webkit has some quirks) and Firefox. Compatibility between browsers in rendering is not an issue these days any more, the only notorious exception being Internet Explorer, but even there the margin is getting smaller and smaller.
I usually develop and full-test in Chrome first, and do a quick "does everything look and behave correctly in other browsers" at the end, so far I have not encountered any major differences between the platforms.
Because Firefox is dog slow (I hope that at least the frequent UI lockups due to synchronous scripts in the site are soon history), and cannot speak with anything webkit.