javascript - Center a ion-button using Ionic framework -

it's first time ionic framework. want center "ion-button", how can it? view:

this html code:

<ion-header>    <ion-navbar>      <button ion-button menutoggle>        <ion-icon name="menu"></ion-icon>      </button>      <ion-title>login</ion-title>    </ion-navbar>  </ion-header>    <ion-content padding>    <h3>effettua l'accesso</h3>      <p>      esegui il login oppure procedi come utente non registrato. clicca in alto sinistra per vedere il menu.    </p>      <form ng-submit="submitlogin()">     <tr>           <td>email</td>         <td><input type="text" ng-model="prodescform.description"/></td>      </tr>     <tr>         <td>password</td>           <td><input type="text" ng-model="prodescform.registerdiscount" /></td>                     </tr>     <button ion-button>login</button>    </form>  </ion-content>

note: changed "page1.html" of ionic project sidebar. how can center button?

first off, i'd recommend against using tables layout of form. recommended way div or similar elements.

however, if absolutely want use table, sure use correctly. mean adding necessary table-related tags make valid table. in case wrapping in <table> should enough.

then apply additional css center button in table row. in example below colspan='2' make column extend full width of tr, class applied text-align: center.

table {    table-layout: fixed;    width: 100%;  }    input {    width: 100%;  }    td.centered {    text-align: center;  }

<form ng-submit="submitlogin()">    <table>      <tr>        <td>email</td>        <td>          <input type="text" ng-model="prodescform.description" />        </td>      </tr>      <tr>        <td>password</td>        <td>          <input type="text" ng-model="prodescform.registerdiscount" />        </td>      </tr>      <tr>        <td colspan="2" class='centered'>          <button ion-button>login</button>        </td>      </tr>    </table>  </form>