md-fab-toolbar height is not set properly with the default Angular Material styles

[chrislambe]

The md-fab-toolbar component seems to work well enough in the docs demo, but in a vanilla Angular Material app it's strangely tall. Turns out it relies on the font-size being set to 62.5% on the html element of the docs demo. That font-size is set by docs.css and so can't be relied upon in a normal Angular Material app.

The height of the FAB toolbar is determined by the md-fab-toolbar-wrapper class which has a height of 6.8rem.

You can see the abnormal height in the codepen demo provided in the docs: http://codepen.io/anon/pen/eNGXpb

[chrislambe]

This could be solved for vanilla Angular Material by setting the height to 4.25rem but that seems like a bandaid. @topherfangio is there any particular reason the height needs to be set? And more specifically why was it set in rem when the other elements in Angular Material are sized in px?

[topherfangio]

@chrislambe Sorry for the delay, I recall there being a reason to set the height, but if I'm basing it off of something in the docs, that's definitely wrong. I will take a look and figure out how to fix this :-)

[chrislambe]

Awesome! Thanks, @topherfangio!