Material: Center content on md-toolbar

[chriseyhorn]

Would be nice to have a way to center content like a logo or text in the center of the md-toolbar. Currently with buttons on left and right you can't have an item centered (is this correct?).

[JustACodeMonkey]

md-toolbar works like a div container, so you can use
<md-toolbar layout="row" layout-align="center center"></md-toolbar>

[olegpopovskiy]

my solution - make 2 span flex around your content -

<md-toolbar  class="md-hue-2">
      <div class="md-toolbar-tools">
        <md-button class="md-fab md-mini md-primary" aria-label="Settings"  ng-click="back()">
          <md-icon md-svg-icon="../../res/icons/ic_arrow_back_white_24px.svg"></md-icon>
        </md-button>

        <span flex></span>
        <h1 class="md-title text-center">{{title}}</h2>
        <span flex></span>

        <div>  <span class="hidden-xs"> Hello <b>{{user.completeName}}</b>!</span>
        <md-button class="md-fab md-mini " aria-label="Eat cake" ng-click="out()">
                    <md-icon md-svg-src="../../res/icons/ic_exit_to_app_white_24px.svg"></md-icon>
        </md-button>

        </div>
      </div>
</md-toolbar>

[aloketewary]

<h1 class="md-title text-center">{{title}}</h2>

to

<h1 class="md-title text-center">{{title}}</h1>