CODEWITHSUNDEEP
angularprimeng
mkHun
mkHun

Reputation: 5921

styleClass is not working in PrimeNg Dialog?

I am trying to add the styleClass in primeNg but it is not working

Html file

<p-dialog [(header)]="dialogText" [(visible)]="displayDlg" [modal]="true" [responsive]="true" 
  styleClass='pDialog' >

CSS File

.pDialog{
width:700px;
overflow: visible;
}

Instead I wrote the contentStyle this is working

<p-dialog [(header)]="dialogText" [(visible)]="displayDlg" [modal]="true" [responsive]="true" 
   [contentStyle]="{'width': '700px','overflow':'visible'}">

How to make it in the css file?

Upvotes: 1

Views: 5712

Answers (2)

MahanteshGowda Patil
MahanteshGowda Patil

Reputation: 141

You can override prime-ng css by using ng:deep

:host ::ng-deep {
     .pDialog{
         width:700px;
         overflow: visible;
     }
}

Upvotes: 2

foxgang
foxgang

Reputation: 97

You can try add 'encapsulation: ViewEncapsulation.None' in your component like this;

@Component({
...
encapsulation: ViewEncapsulation.None

})

Upvotes: 0

Related Questions