Ion-footer with ion-toolbar and ion-buttons not styled correctly

Ionic version: [X ] 3.x

I’m submitting a … [X ] bug report

Current behaviour: When I place a <button> inside a <ion-buttons> (inside a toolbar in a footer) it is not styled correctly.

See: https://forum.ionicframework.com/t/ion-footer-with-ion-toolbar-and-ion-buttons-not-styled-correctly/89932

Expected behaviour: A <button> inside a <ion-buttons> (inside a toolbar in a footer) should be styled as per a <button> (inside a toolbar in a footer but) not inside an <ion-buttons>.

Steps to reproduce: http://plnkr.co/edit/fyJdsXxKLcSM68l4dyAw?p=preview

Related code:

<ion-header>
  <ion-toolbar>
    <h1 class="post-title">Your Post Title</h1>
  </ion-toolbar>
</ion-header>

<ion-content class="page-editor">
Your post content...
</ion-content>

<ion-footer>
  <ion-toolbar color="secondary">

    <button ion-button color="save">
      SAVE DRAFT
    </button>

    <ion-buttons end>
      <button ion-button color="save">
        SAVE DRAFT
      </button>
    </ion-buttons>
    
  </ion-toolbar>
</ion-footer>

Other information: See: https://forum.ionicframework.com/t/ion-footer-with-ion-toolbar-and-ion-buttons-not-styled-correctly/89932

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Your system information:

Cordova CLI: 6.5.0 
Ionic Framework Version: 3.1.0
Ionic CLI Version: 2.2.3
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.3.6
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v6.10.3
Xcode version: Not installed

[brandyscarney]

I can’t get the plunker to work for me, could you tell me what doesn’t work about it? Here’s how the attributes work:

start- Positions element to the left of the content in ios mode, and directly to the right in md and wp mode. end- Positions element to the right of the content in ios mode, and to the far right in md and wp mode. left- Positions element to the left of all other elements. right- Positions element to the right of all other elements.

These are documented here: http://ionicframework.com/docs/api/components/toolbar/Toolbar/#buttons-in-a-toolbar

If you are seeing start on the right side in md or wp mode this is the correct behavior.

[mhartington]

@franzisk as this is a closed issue, please open a new issue if there are any problems.

https://stackblitz.com/edit/ionic-unmdy9?file=pages/home/home.html