CSS not applied properly on custom components in Angular : <p>I have a custom component and I'm using a number of those in the markup of the parent. When I declare a style <strong>within</strong> the custom component, it performs as expected. However, when I set the style in the parent component selecting each of the custom one, the formatting takes place but doesn't target the custom component - instead it gets a hit outside of it and not in relation of it.</p>

<p>In the <a href="https://stackblitz.com/edit/angular-ui8zwm?file=src%2Fapp%2Fapp.component.html" rel="nofollow noreferrer">Blitzy example</a>, the border can be seen not <strong>around</strong> the hellows, but <strong>outside</strong> of them.</p>

<p>I don't understand why it happens, let alone how to resolve it.</p>
