Material-ui: [Avatar] Inline Chips size ignored.

[BlockChange]

When I override the style for a chip to display: inline, it will shrinks the right side to the height of the text.

<Chip style={{ display: 'inline' }} ><Avatar size={23} src="/images/logos/logo.png" />{name}</Chip>

I was going to compromize by setting the Avatar size prop, but it gets overridden by the chip it seems.

• Are there plans for supporting inline chips? (I've not been able to find the style that would fix the shrinking issue)
• The Avatar size should be adhered to.

(Mui 0.15.2)

[BlockChange]

Ok, solution turns out to be very simple:

{ display: 'inline-block' }

[BlockChange]

I think adding a new prop inline would be nice to support these usecases.

Although it would need a size prop as well I think, and the avatar size prop need to be applied.

[oliviertassinari]

but it gets overridden by the chip it seems.

@BlockChange You are right. I think that we should consider it a bug, at this line.

I'm not sure to understand your use case for the _inline_ stuff. Do you have a visual explanation?

[danep93]

Problem seems solved, this should be closed

[oliviertassinari]

I'm going to close the issue. Things aren't perfect but the pain point seem addressed.

[peterpuzos]

@oliviertassinari Although the post talks about "inline" chip styles. The real issue for this ticket should be the Avatar size prop in Chips is currently hard coded at 32.

Therefore you can't pass down a size prop from Avatar when its used within. This needs to be fixed as when a chip is styled to be smaller, the avatar shouldn't remain at 32, it should take the prop that is being passed down.

That line should be
size: avatar.props.size || 32

[oliviertassinari]

@peterpuzos Yes, I think that you are right! Do you want to submit a PR with that fix and the corresponding test?