How to set an Ionic list item height with a background image
angularjs, css, html, ionic-framework
Solution
Solved it by using "line-height" instead of "height":
ng-style="{'line-height': '250px'}"
Although this does not allow for wrapping longer text.
Problem
In Ionic, I am trying to show a list of items, each with a background image. I am trying to increase the height, but my current solution only increases the blank space, and does not show more of the background image: ``` <ion-content> <ion-list> <ion-item back-img="{{post.image.url}}" ui-sref="app.post({id:post.ID})" ng-repeat="post in data.posts" ng-style="{'height': '250px'}" > {{post.title}} </ion-item> </ion-list> </ion-content> ``` ``` .directive('backImg', function(){ return function(scope, element, attrs){ var url = attrs.backImg; var content = element.find('a'); content.css({ 'background': 'url(' + url +')', 'background-size' : 'cover' }); }; ``` How can I set the list item height in a way that the background image for each row is fully shown? (I assume I would have to set the background-CSS on the container, not the anchor? How?)