[besson3c]

So much stuff has been added to the Webkit dev tools, that I'm wondering when/if CSSEdit will cease to exist some day.

You can make your inline edits in the inspector and have your changes written to your stylesheet, kept under revision control, and you can save the new stylesheet overwriting the old version. There is full auto-complete of course, and the ability to add/remove/hide existing styles.

I'm just wondering, is there anything that CSSEdit does that the inspector can't now, or things about it that you like more? What would it take you to switch?

[Demonhood]

I still use it. I like the look/feel of it far more than the inspector. That said, it is way way behind the times.
I'll likely replace it with Coda 2 once that is released.

[besson3c]

Can you be more specific what sort of things you prefer with it?

I'm not trying to start an inspector vs. CSSEdit debate, I'm just wondering where inspector can improve. It's been undergoing rapid development and accepting feedback.

[Demonhood]

Part of it is my lack of experience with advanced use of Inspector. For example, I have no idea how to:

...make your inline edits in the inspector and have your changes written to your stylesheet, kept under revision control, and you can save the new stylesheet overwriting the old version.

I appreciate Inspector's ability to show me ALL of the css for a page. And which are applicable to which element. I also like hovering over the code and seeing the actual page element highlight. I prefer, though, CSSEdit's X-ray mode for doing it the other way around. Inspector does the same thing (with the magnifying glass), but after you click, it goes away. I would prefer a toggle. Maybe even one in which you can double click on the element and be taken, not only to the code, but to the css element itself. I guess I find myself more often focusing on just one css file, which I can't seem to do in Inspector.
Inspector doesn't make it any easier with a rather plain interface. No color picker, no options. Sometimes, just sometimes, I prefer to quickly click something than to have to rewrite a line of code.

[besson3c]

Originally Posted by Demonhood 

Part of it is my lack of experience with advanced use of Inspector. For example, I have no idea how to:



I appreciate Inspector's ability to show me ALL of the css for a page. And which are applicable to which element. I also like hovering over the code and seeing the actual page element highlight. I prefer, though, CSSEdit's X-ray mode for doing it the other way around. Inspector does the same thing (with the magnifying glass), but after you click, it goes away. I would prefer a toggle. Maybe even one in which you can double click on the element and be taken, not only to the code, but to the css element itself. I guess I find myself more often focusing on just one css file, which I can't seem to do in Inspector.
Inspector doesn't make it any easier with a rather plain interface. No color picker, no options. Sometimes, just sometimes, I prefer to quickly click something than to have to rewrite a line of code.

A color picker could definitely be useful!

I don't know if you are asking how to do these things with the Webkit inspector, but if you are, to access any element just right/control click on it, go to inspect element in either Chrome or Safari. This will bring up the inspector window which you can either make a separate window or leave as the lower pane of the window (which I believe is the default).

If you mouseover anything in the inspector window it will highlight the element it corresponds to in the browser window (you don't need to use the magnifying glass while in the "Elements" tab). Click on any element in the inspector window and you'll see its CSS properties including elements it has inherited (under "computed style"). You can click on any non-computed property or property value to change its value, add new properties, and you can arrow up or down on your keyboard to scroll through different values, which is very useful for positioning elements.

You can learn more about saving your changes and the revision control in the first part of this video:

A Re-introduction to the Chrome Developer Tools � Paul Irish


I'm not saying that the Webkit dev stuff is flawless or that anybody should switch to it necessarily, but there is so much you can do with it, and it really has been improving and getting new features added to it pretty rapidly. There certainly is something nice to being able to tweak CSS values and access a Javascript CLI console from within the browser using the same tools that are available in both Mac and Windows versions of Safari and Chrome (although the features in the Safari version are generally a far more conservative selection from what is available from the main Webkit codebase).

I'm just kind of interested in following its development, and wondering where it might go next. The color picker thing seems like it might be pretty useful!

[besson3c]

I'm also wondering if anybody in here has gotten into Javascript breakpoints?