Vertically align text between two buttons on Ionic 2

0

I'm having difficulty vertically aligning the value between 2 buttons. Here is the code snippet and the result:

<ion-list>

<ion-thumbnail item-start>
  <img src={{produto.foto}}>
</ion-thumbnail>
<h2>{{ produto.nomeProduto }}</h2>
<h3>{{ produto.nomeMedida }}</h3>
<p class="pValor"> {{ produto.valorProduto | currency:'BRL':true:'1.2-2' }} </p>

<div item-end >  
  <button ion-button round>
    <ion-icon name="remove"></ion-icon>
  </button>

    {{ produto.quantidadeProduto }}

  <button ion-button  round>
    <ion-icon name="add"></ion-icon>
  </button>
</div>

    
asked by anonymous 12.07.2017 / 00:07

2 answers

0

Try to put your text inside a div with the following Ionic command

<div margin-top>
  {{ produto.quantidadeProduto }}
</div>

If it does not work out or be in doubt about something, use the Ionic documentation, it's very complete!

Ionic: Ionic CSS Documentation

    
13.07.2017 / 14:16
0

Thank you! I was able to solve with the code below.

<span  style="vertical-align: -26%;" item-left>{{ produto.quantidadeProduto }}</span>
    
14.07.2017 / 20:08