Word wrapping inside ion-row with Ionic 2

Question

I'm trying to configure word wrapping inside a ion-col, but I just can't manage to get it working.

Here's an image showing my problem:

What I want to do is to make the part that is overlaying drop down to the next line.

Here's how everything is structured:

<ion-item *ngFor="let visitante of visitantes">
  <ion-row wrap text-wrap>

    <ion-col width-50 text-wrap>
      Nome: {{ visitante.nome }}<br> <!-- this is what should go to the next line
      CPF : {{ visitante.cpf}}<br>
      Placa: {{ visitante.placa }}<br>
    </ion-col>

    <ion-col width-34>
      Liberado até:<br>
      {{ visitante.horaFim }}<br>
      {{ visitante.diaFim }}
    </ion-col>

    <ion-col width-10 text-right>
      <button ion-button icon-only>
        <ion-icon name="trash"></ion-icon>
      </button>
    </ion-col>

  </ion-row>
</ion-item>

Does anyone know why this isn't working? Is this not possible?

Thanks.

Answer 1

white-space:normal did the trick! Thanks guys!