Search code examples
ionic-frameworkionic4ion-grid

How made ion-col expand the text over the col

I want to the col-8 expand a text an dont center:

<ion-row style="height: 100%;">
  <ion-col col-2>
      <!--<ion-img class="img-menu" src="../../assets/imagen/m-lista.png" routerLink="/datospersonales"></ion-img> -->
  </ion-col>

  <ion-col col-8>
      <p class="titulo-opcion">Venta Nueva</p>
      <p>Permite el ingreso de Proyectos a clientes Nuevos o Existentes</p>
  </ion-col>

  <ion-col col-2>
      <!--<ion-img class="img-menu" src="../../assets/imagen/m-flechita.png"></ion-img>-->
  </ion-col>
</ion-row>

But the image SNAP Show all the text center I want the first column keep 2 and 8 the center and 2 last one,

Solution

  • Based on what you have said it sounds like you want this:

    <ion-row style="height: 100%;">
  <ion-col>
      <p class="titulo-opcion">Venta Nueva</p>
      <p>Permite el ingreso de Proyectos a clientes Nuevos o Existentes</p>
  </ion-col>
</ion-row>

    But I think you haven't worded it exactly so maybe this won't be the answer.

    As I commented above please rewrite your question if this doesnt solve it.