组件css / scss不会影响angular2中的元素类

Question

I'm working on an angular 4 project and I'm trying to override css in a specific component. My changes also show up after compiling but they are not affecting the element. The element sits in a parent component, but I already tried using :host.

Element:

Generated CSS:

Answer 1

I had this same problem and I found out you can style your children component from its parent. The generated css never match what you want. See the picture. I solved it by passing a state info(expanded @input attr) to the child component and styling it according to this state value as so:

Image illustrating my point

...