Space between columns

Ionic Framework ionic-v3
1

I would like the text in my column to sit nearly right next to each other but right now there is a HUGE gap between them. How do I stop that from happening?

Feels Like: {{weather.feelslike_f}} Humidity: {{weather.relative_humidity}} Visibility: {{weather.visibility_mi}} Dewpoint: {{weather.dewpoint_f}} Pressure: {{weather.pressure_in}} UV Index: {{weather.UV}}
2

Add the no-padding attribute to your ion-grid or change the CSS on the column.

<ion-grid no-padding>
  <ion-row>
    <ion-col>
      ...
    </ion-col>
  </ion-row>
</ion-grid>
3

That has not seemed to have worked.

<ion-grid *ngIf=“weather” no-padding>

</ion-grid>

Capture
Capture

4

I think you’ll have to add an empty column after the second one, i.e.
<ion-col></ion-col>

And then mess with different explicit column sizes for the other two. I’d probably start with col-4 so something like: <ion-col col-4></ion-col>

(The third “dummy” column will take up the remaining space)

5

Thanks for everyone help but I needed to add a class to the grid and use align-items: center;