CSS between components & controllers

[luxcem]

I'm facing an issue with the list controller, trying to style it with thumbnail : http://ionicframework.com/docs/components/#item-thumbnails

<view title="'My List'">
  <content has-header="true" has-tabs="true">
    <list>
      <item ng-repeat="item in list" item-type="item item-thumbnail-left" href="#">
        <img class="item-image" ng-src="img/{{item.thumb}}" width="50">
        <h2>{{item.title}}</h2>
        <p>{{item.description}}</p>
      </item>
    </list>
  </content>
</view>

However the html produced is :

<div class="item item-complex ng-scope ng-isolate-scope item-thumbnail-left" ng-repeat="item in list" item-type="item item-thumbnail-left" href="#" style="">
    <a class="item-content" ng-href="#" ng-transclude="" href="#">
        <img class="item-image ng-scope" ng-src="img/something.jpeg" width="50" src="img/something.jpeg">
        <h2 class="ng-scope ng-binding">Something</h2>
        <p class="ng-scope ng-binding">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
    </a>
</div>

Instead of

 <a class="item item-thumbnail-left" href="#">
      <img src="cover.jpg">
      <h2>Pretty Hate Machine</h2>
      <p>Nine Inch Nails</p>
    </a>

The css for thumbnail is :

.item-thumbnail-left {
  padding-left: 105px;
  min-height: 100px; }
  .item-thumbnail-left > img:first-child, .item-thumbnail-left > .item-image {
    position: absolute;
    top: 10px;
    left: 10px;
    max-width: 80px;
    max-height: 80px;
    width: 100%; }

But in that case img / .item-image is not a direct child of item-thumbnail-left.

[adamdbradley]

Thanks, I added in some fixes.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.