typescript - How do I reference host element in CSS of an Angular2 component? -

i have component in angular2 , want set padding on host element.

@component({     selector: 'my-app',     template: 'hello world'     styles: ['my-app {padding: 10px}'] }) 

in browser, style looks this:

my-app[_ngcontent-icu-3] {padding: 10px;} 

while host element looks this:

<my-app _ngcontent-icu-1="" _nghost-icu-3="">     <div class="content" _ngcontent-icu-3=""></div> </my-app> 

as understand it, angular2 adds these _ng attributes css references specific components.

but how reference host element css defined inside component?

styles: [':host {padding: 10px}'] 

or

@component({     selector: 'my-app',     template: 'hello world'     host: {'[style.padding.px]': '"10"'} }) 

the added _ng... classes emulating scoped styles (default encapsulation: viewencapsulation.emulated) similar shadow dom does.