Ion-radio with collection-repeat


#1

Hi,
I’ve used ion-radio with collection-repeat and i’ve specified item-height for each item (which is greater than first item)
When i select an item from list the background color change applies to only item label (height) rather than whole item.

here is the codepen url which describes problem

How this can be solved, please help me.

Thanks
Satish Lakhani


#2

Resolved this issue using following css trick.
just add following css class:

.item-radio input:checked ~ .item-content {
height: 100%;
}

Updated code pen:
here is the codepen url which describes problem


#3

Thanks @satishlakhani, i had same issue as the text grows in collection-repeat and wraps to new line. This solution worked for me.