CSS utility class not working

Hi,

I am using the latest CLI to generate the initial project. The css utility classes, explained in https://ionicframework.com/docs/theming/css-utilities/, are not included. For example, text-center is not defined. Should I change any SCSS file to include these classes’s declaration?

Thanks,
Yuhang

To help people help you, you should always post a copy of the output from ionic info:

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.19.2
    ionic (Ionic CLI) : 3.20.0

global packages:

    cordova (Cordova CLI) : not installed

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : none
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.0.2
    ios-deploy        : 1.9.2 
    Node              : v9.9.0
    npm               : 5.6.0 
    OS                : macOS Sierra
    Xcode             : Xcode 9.2 Build version 9C40b 

Environment Variables:

    ANDROID_HOME : /Users/rob/Library/Android/sdk

Misc:

    backend : pro

Some background information, e.g., I’m building a PWA:

ionic start MyApp --no-cordova blank

And some sample code that demonstrates the issues:

   <!-- Sign In -->

    <ng-container *ngSwitchCase="'sign-in'" padding>

      <ion-row>
        <ion-col text-center>

          <button ion-button icon-start class="google-social-icon-button" (click)="signInWithGoogle()">
            <ion-icon item-start name="fa-google"></ion-icon>
          </button>

          ...

        </ion-col>
      </ion-row>

    </ng-container>

44

1 Like