title: Mattooltip: How can I make the box fit the text?
body: <p>I have this text that I want to display as tooltip. Without styling (just font-size defined as 16px) it looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/abIJv.png" rel="noreferrer"><img src="https://i.stack.imgur.com/abIJv.png" alt="enter image description here"></a></p>
  
  <p>What I actually want is to have the text displayed in one line - so I set the white-space to pre in the css:</p>
  
  <pre><code>::ng-deep .mat-tooltip {
    font-size: 16px;
    white-space: pre;
  }
  </code></pre>
  
  <p>But now the text goes outside the box of the tooltip:</p>
  
  <p><a href="https://i.stack.imgur.com/PIWzu.png" rel="noreferrer"><img src="https://i.stack.imgur.com/PIWzu.png" alt="enter image description here"></a></p>
  
  <p>I tried setting the width to a higher px value but that did nothing.</p>
  
  <p>Is there a way to make the box fit the text?</p>
  
  <p><strong>[EDIT - Added missing example as was pointed out in the comments]</strong>: <a href="https://stackblitz.com/edit/angular-mat-tooltip-yyziyd" rel="noreferrer">stackblitz link</a> <br>
  The text in the example does not leave the box but is abbreviated instead of the box fitting around the whole text altough I set the width to 400px.</p>