title: How to wrap text of primeng checkbox label?
body: <p>I'm having troubles wrapping the text of the checkbox label. I read the <a href="https://www.primefaces.org/primeng/#/checkbox" rel="nofollow noreferrer">docs</a> and <a href="https://stackoverflow.com/questions/46350302/primeng-how-to-use-styleclass">how to use styleClass properties</a> and I'm still not able to make any change.</p>
  
  <p>I'm not using <code>:host /deep/</code> selector because I'm not using the styleUrl of the @Component, instead one loaded and adapted for Firefox.</p>
  
  <p><code>ui-chkbox-label</code> is not used anywhere in the project besides primeng lib and me in the below code.</p>
  
  <p>html:</p>
  
  <pre><code>&lt;p-checkbox styleClass="chBoxOne" labelStyleClass="lblChBoxOne" [(ngModel)]="allowParticipation"  
  binary="true" 
  label="This very very long sentence needs to be wrapped to make it fit"     
  (click)="onClickAllowParticipation()"&gt;&lt;/p-checkbox&gt;
  </code></pre>
  
  <p>css attempts:</p>
  
  <pre><code>/*labelStyleClass + Container*/
  .lblChBoxOne.ui-chkbox{
      word-wrap:break-word;
  }
  
  /*labelStyleClass + Label element*/
  .lblChBoxOne.ui-chkbox-label{
      word-wrap:break-word;
  }
  
  /*labelStyleClass + Container element + Label element*/
  .lblChBoxOne.ui-chkbox.ui-chkbox-label{
      word-wrap:break-word;
  }
  /*labelStyleClass + Container element + Label element + Label element of a checked state.*/
  .lblChBoxOne.ui-chkbox.ui-chkbox-label.ui-label-active{
      word-wrap:break-word;
  }
  /*labelStyleClass + Container element + Label element + Label element of a focused state .*/
  .lblChBoxOne.ui-chkbox.ui-chkbox-label.ui-label-focus{
      word-wrap:break-word;
  }
  /*labelStyleClass + Container element + Label element + Label element of a disabled state.*/
  .lblChBoxOne.ui-chkbox.ui-chkbox-label.ui-label-disabled{
      word-wrap:break-word;
  }
  
   /*styleClass + Container*/
  .chBoxOne.ui-chkbox{
      word-wrap:break-word;
  }    
  
  /*styleClass + Label element*/
  .chBoxOne.ui-chkbox-label{
      word-wrap:break-word;
  }
  
  /*styleClass + Container element + Label element*/
  .chBoxOne.ui-chkbox.ui-chkbox-label{
      word-wrap:break-word;
  }
  /*styleClass + Container element + Label element + Label element of a checked state.*/
  .chBoxOne.ui-chkbox.ui-chkbox-label.ui-label-active{
      word-wrap:break-word;
  }
  /*styleClass + Container element + Label element + Label element of a focused state .*/
  .chBoxOne.ui-chkbox.ui-chkbox-label.ui-label-focus{
      word-wrap:break-word;
  }
  /*styleClass + Container element + Label element + Label element of a disabled state.*/
  .chBoxOne.ui-chkbox.ui-chkbox-label.ui-label-disabled{
      word-wrap:break-word;
  }
  </code></pre>
  
  <p>Result:</p>
  
  <p><a href="https://i.stack.imgur.com/8LsMX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8LsMX.png" alt="Wrap text primeng checkbox"></a></p>