how to increase the width of list in ionic?

Question

I am trying to make a list as shown in image.I am able to make a list using ng-repeat but my child elements not same as shown in image why ? I used nested ng-repeat ..could you please tell me where i am doing wrong to make same list as shown in figure ? [![enter image description here][1]][1]

here is my code http://play.ionic.io/app/8a3d7bbaf403

  <ion-header-bar class="bar-stable">
        <h1 class="title">Awesome App</h1>
      </ion-header-bar>
      <ion-content>
      <ion-list>
        <ion-item  style="background-color:grey;" ng-repeat="item in collect track by $index">
          <p style="color:white;">{{item.childName }}</p>
          <ion-list>
  <ion-item ng-repeat="i in item.grandChildren">
    {{i.grandChildName}}!
  </ion-item>
</ion-list>
        </ion-item>
       </ion-list>
    </ion-content>

Answer 1

You have to remove the padding from the 'child' list items and then add the same padding only around the 'child' title.

I changed your html a bit to use classes and I wrapped the title in a div

  <ion-header-bar class="bar-stable">
    <h1 class="title">Awesome App</h1>
  </ion-header-bar>
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="item in collect track by $index" class="child-item">
        <div class="child-title">{{item.childName }}</div>
        <ion-list>
          <ion-item ng-repeat="i in item.grandChildren">
            <span class="grandchild-name">{{i.grandChildName}}!</span>
            <span class="grandchild-count">{{i.grandChildCount}}</span>
          </ion-item>
        </ion-list>
      </ion-item>
    </ion-list>
  </ion-content>

Then in your CSS you can use these classes

.child-item {
   background-color: grey;
   padding: 0;
}
.child-title {
  text-transform: uppercase;
  color: white;
  padding: 16px;
  margin: -1px;
}
.grandchild-count {
  float: right;
  padding-right: 16px;
  font-weight: bold;
}

Link to sample: http://play.ionic.io/app/2bb6c01bd2cb

And the output now looks like this:

[![list output][1]][1]