CODEWITHSUNDEEP
javascripthtmlcssionic-framework
Sobucki
Sobucki

Reputation: 105

How do I use CSS in ion-list, ion-item

I am developing an app and I am getting data from JSON and it works well, but my problem is that I don't know how to use CSS style using the directive. Below I am showing the code. The second code is the code that the css works.

<!-- With Json </!-->

<ion-list>  
    <ion-item>

       <a class="item item-avatar" ng-repeat="x in names|orderBy:'Name'"  href="#">
          <img ng-src="{{x.Image}}">
          <h2>{{x.Name}}</h2>
          <p>  {{x.Local}}</p>
        </a>

    </ion-item>
</ion-list> 


<!-- example static, without json, css works good  </!--> 
<div class="list" id="inicioPalestrantes" >
   <a class="item item-avatar" id="palestrantes" href="#">
     <img src="Fiona.jpg">
     <h2>Fiona Doohan</h2>
     <p> UDC, Dublin, Ireland </p>
   </a>
</div>

Upvotes: 2

Views: 3665

Answers (1)

Asons
Asons

Reputation: 87211

You need the id selector # better use the class instead of id for your CSS rules.

.list .item {
  background-color: #F0F8FF;
  border-width: 1px;
  border-style: ridge;
  border-color: #C0C0C0;
}

.list {
  margin-top:0%;
}

Upvotes: 1

Related Questions