You can consider to open the Inspector in a new window (there is an icon to do this)m so you can drag it to a convenient position (e.g. at the right of the browser window so you see the style panel, but not the HTML panel).
This layout has the advantage that the web page width doesn't change.
With the previous layout with the CSS rules next to browser page you always got a scroll bar.

Thank you, I already know this. It has advantages and disadvantages. I guess it depends on your style of working.

I like to look at the page being updated as I make the changes to styles. I also mainly use only the style viewer and on several pages at the same time. It will get slightly confusing having a few inspector windows.

Worse still, I need the inspector style viewer at maximum height but now I have to resize the inspector HTML viewer width to nothing then maximise the height.

In the old layout you can turn html/style viewer (rules) on and off by the press of a button so it was not a big deal if it temporarily alters the dimension of the page. At least that's is the way I viewed it.

I guess there isn't a way. Oh well, if I am in the minority here I have to adapt.

I found this an annoying problem as well. Since I only use the inspector to inspect and use firebug to view the style rules I was able to solve the problem like this:

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

.devtools-tabbar,
.devtools-side-splitter,
.devtools-sidebar-tabs,
.devtools-horizontal-splitter {
 display:none!important;
}

(edited to make the code more readable - c)

The new version is hopeless - which is a pity because this feature is just about the only reason I stick with FireFox as a developer. Previously I could hit Ctrl-shift-I to bring up the nice site panel, which often with wide-screen monitors is dead-space. The HTML panel wasn't shown by default and I seldomly needed it. I could hit ESC to get rid of it.

NOW - the ESC key does nothing so I have to move my hand back to my mouse and click on the 'x' button to get rid of the panel. I can't get rid of the HTML part and the pane takes up the whole of the lower part of my screen which is NOT dead space.

In the truncated CSS panel at the bottom of the page I can only see the first couple of styles - often I want to see further down the list so I just about always have to scroll.

NO: opening in a separate window is NOT a solution!

If you're going to change the layout without first doing some research on how people use a tool then please make sure you have the option in the first few releases to go back to the old layout - just in case, on the off chance, what you're doing is really really silly!

Agreed. I found Firebug better than Web Developer EXCEPT the layout of WD was far better and more user friendly. Now they seem to have copied Firebug's crappy layout!

I am glad that I am not the only one that found this a step backward. It really is an awful design. I tried to look at other browser but they all seem to have the same design which is a shame.

For those interested you could try a portable version from here. But lack of multiple instances makes it somewhat useless for me.