How to add link to app toolbar main-title?

[AucT]

I'm learning polymer, and when I add link to

<app-header fixed effects="waterfall" slot="header">
        <app-toolbar>
          <div spacer main-title><a href="/">Title</a></div>
          <paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
        </app-toolbar>
      </app-header>

<app-header fixed effects="waterfall" slot="header">
        <app-toolbar>
          <a href="/"><div spacer main-title>Title</a>
          <paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
        </app-toolbar>
      </app-header>

<app-header fixed effects="waterfall" slot="header">
        <app-toolbar>
          <a href="/" spacer main-title>Title</a>
          <paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
        </app-toolbar>
      </app-header>

As you see I tried 3 different ways, but the link doesn't work. How to solve this problem?

[keanulee]

The <a> link needs to be outside of main-title completely, since main-title cannot be clicked (https://github.com/PolymerElements/app-layout/blob/master/app-toolbar/app-toolbar.html#L87). One possible way would be:

      <app-header fixed effects="waterfall" slot="header">
        <app-toolbar>
          <div spacer></div>
          <a href="/">Title</a>
          <div main-title></div>
          <paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
        </app-toolbar>
      </app-header>

[AucT]

@keanulee thanks for info.