How to style ng-content, ::ng-deep not working

Question

I am trying to style content inside <ng-content> in anuglar2

<au-fa-input >
   <input type="text" class="form-control" placeholder="email" #input>
 </au-fa-input>

Inside au-fa-input component css i try

  :host /deep/ input{
   display:none
  }

OR

::ng-deep input{
   display:none
  }

But this is not working

Answer 1

i think /deep/ does not apply directly on ng-content and ng-template, it does on nested component for example so you have to create a div with a class that contain you element and try something like that:

<ng-content>
   <div class="deepClass">
     <au-fa-input >
         <input type="text" class="form-control" placeholder="email" #input>
     </au-fa-input>
   </div>
</ng-content>

and css

.deepClass /deep/ input {
   display:none
}