undefined | Better HN

0 pointsseanlinmt15y ago0 comments

The best part about firebug is that it allows you to change the css on the spot and you get to see how that affects your layout immediately.

0 comments

alinajaf15y ago

I think I'm in the minority but I've never really seen the appeal. I've always much preferred chromes developer tools. Right click on anything and choose 'inspect element' to see what I mean.

pierrefar15y ago

But that's how Firebug does it in Firefox!

And on my Chrome, there is a regular inconsistent bug that when I want to inspect an element, the new tool UI is displayed but the element is not selected.

henrikschroder15y ago

I've never used Chrome so I don't know if it's better or worse.

My point though is that it's first in recent years that we've had tools like these, and they made a huge difference for me helping me undesrtand what the hell goes on with the styles. It's a much nicer workflow than the old edit-reload-check-edit-reload-check model, where you inserted coloured borders to see exactly how large your divs were, and moved things a few pixels at a time until it looked right.

tcdent15y ago

Chrome's developer tools are actually WebKit's, so you'll be able to use the latest/greatest version in WebKit nightlies.

metamemetics15y ago

The best part about FireBug is actually JavaScript debugging and the JavaScript console. Writing a web-app would be nearly impossible without this.

For simple CSS you probably want to be changing it in a seperate text editor that auto-refreshes your web-browser so you have the benefit of being able to save.

The CSS-changing feature you mentioned is of questionable use while the JavaScript features are essential.

isleyaardvark15y ago

Firebug is great for CSS because it allows you to find the specific CSS rules for a selected element, along with the line number it appears on in the CSS file(s), helping you find it in the separate text editor in the first place. Also you can try out new rules very quickly and get instant feedback without switching programs and setting up an auto-refresh.

I switched to Webkit's JS debugging tool not long ago, it has much better warnings than Firebug.

seanlinmtOP15y ago

I actually prefer webkit's javascript console. It's easier to traverse objects that you print out using console.log and it has intellisense. :)

atestu15y ago

If you're on a Mac, MacRabbit's CSSEdit [http://macrabbit.com/cssedit/] does that too. It's a fantastic application. I can't design without it.

Usually, I draw a basic sketch on a piece of paper, then write the HTML file in TextMate, and then spend a lot of time in CSSEdit.

j / k navigate · click thread line to collapse