javascript - Center a ion-button using Ionic framework -


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

enter image description here

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>


Comments

Popular posts from this blog

qt - QML MouseArea onWheel event not working properly when inside QML Scrollview -

java - is not an enclosing class / new Intent Cannot Resolve Constructor -

python - Error importing VideoFileClip from moviepy : AttributeError: 'PermissionError' object has no attribute 'message' -