[ionic.4] ion-item more slots

[RHinderiks]

Feature Request

Describe the Feature Request
We would like more slots, For example for keeping things at the top-left of a list item. This is quite normal behaviour when for example using avatars (github being one of those examples

Describe Preferred Solution
More slots

Describe Alternatives
Change current behaviour so elements aren't centered vertically.

[brandyscarney]

Thanks for the issue! This can be done using CSS, like the following:

<ion-item>
  <ion-avatar slot="start"></ion-avatar>
  <ion-label>
    <h1>Heading</h1>
    <h2>Heading</h2>
    <h3>Heading</h3>
  </ion-label>
</ion-item>

ion-avatar {  
  align-self: flex-start;
}

Here's a Codepen example: https://codepen.io/brandyscarney/pen/qwdJRJ?editors=1100

We also have CSS Flex Utilities for quickly aligning flex items.

Is this what you're looking for?

[ionitron-bot]

Thanks for the issue! This issue is being closed due to the lack of a reply. 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.

Thank you for using Ionic!