CODEWITHSUNDEEP
javascripthtmlcssangularjsionic-framework
user7422910
user7422910

Reputation:

Ionic css code not working for ion-card or a button

My css for my ionic app is not working .

enter image description here

As you can see it does noting I am use the wp rest api and getting the content to show but i am trying to do a ionic card https://ionicframework.com/docs/v2/components/#card-list but the css is not working neither on the card or on the button i tried removing the ng-repeat on the ion-list but it does the same thing i check in the inspect element but it does not seem to be add any class or css to anything just some margins and padding I am including the ionic css file but it does not change anything

Here is my code:

<ion-view view-title="Home">
  <ion-content>
    <ion-card>
 <ion-card-header>
    Articals
  </ion-card-header>

  <ion-list  ng-repeat="page in content">
    <button ion-item>
            <img src="img/logo.png" width="50">
            <button ion-button outline item-right icon-left color="dark">
      <ion-icon name="ion-ios-book"></ion-icon>
      View
    </button>
    </button>
</ion-card>
  </ion-content>
</ion-view>

This is what is being inculded here:

<meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>
 <link rel="manifest" href="manifest.json">
    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="cordova.js"></script>
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
  </head>

Thank You!

Upvotes: 1

Views: 2989

Answers (1)

user7431951
user7431951

Reputation:

Try adding the following for buttons,

<button ion-button outline item-right icon-left class="button button-dark">

and for the cards look at this, also it looks like you are using V2, try using V1.

Upvotes: 0

Related Questions