I've just discovered DebugBar for IE and it's really useful thanks. I'm currently using DebugBar within IETester 0.3.2.

One thing that I'd find *really* helpful and would help speed up debugging is listing the declarations in the "Style" and "Comp. Style" tabs in alphabetical order.

For example, I'm examining a < > TABLE tag and in the Comp. Style tab I see something like this:

BORDER-LEFT-WIDTH: 0px;
WIDTH: 500px;
FONT-SIZE: 180;
MARGIN-RIGHT: 0px;
BORDER-COLLAPSE: separate;
PADDING-TOP: 0px;
VERTICAL-ALIGN: middle;
DISPLAY: block;
BORDER-BOTTOM-WIDTH: 0px;
FONT-FAMILY: Verdana;
BORDER-TOP-WIDTH: 0px;
LINE-HEIGHT: 1.5;
BACKGROUND-COLOR: transparent;
PADDING-RIGHT: 0px;
BORDER-RIGHT-WIDTH: 0px;
PADDING-LEFT: 0px;
MARGIN-BOTTOM: 1.4em;
COLOR: #222;
TEXT-ALIGN: left;
MARGIN: 0px 0px 1.4em;
PADDING-BOTTOM: 0px;

It's really hard to quickly scan through the list and pick out what padding has been set, for example, as those declarations are scattered throughout the list.  Arranging it alphabetically, however, makes it much easier:

BACKGROUND-COLOR: transparent;
BORDER-BOTTOM-WIDTH: 0px;
BORDER-COLLAPSE: separate;
BORDER-LEFT-WIDTH: 0px;
BORDER-RIGHT-WIDTH: 0px;
BORDER-TOP-WIDTH: 0px;
COLOR: #222;
DISPLAY: block;
FONT-FAMILY: Verdana;
FONT-SIZE: 180;
LINE-HEIGHT: 1.5;
MARGIN-BOTTOM: 1.4em;
MARGIN-RIGHT: 0px;
MARGIN: 0px 0px 1.4em;
PADDING-BOTTOM: 0px;
PADDING-LEFT: 0px;
PADDING-RIGHT: 0px;
PADDING-TOP: 0px;
TEXT-ALIGN: left;
VERTICAL-ALIGN: middle;
WIDTH: 500px;

I'd also prefer to see the declarations displayed in all-lowercase (or at least an option that allows me to select whether these declarations are shown as upper- or lowercase) as it's much easier to read (less shout-y) and while I recognise that CSS is case-insensitive it's generally written in all-lowercase.

Thanks

Gareth