title: Unknown Width on Tooltip
body: <p>I have a responsive tooltip I'm trying to make and somehow, there is a width that seems to be appearing out of no where that I just can't figure out why it's doing what it's doing. If you check out the below codepen, it's mostly functional, but the tooltip_text that appears isn't the full width of the text. It's just... the size it appears at, even though there's no width on it at all. Putting 100% width on it makes it shrink down to the 24px the tooltip is, and since I want it responsive, I can't put a solid width on it (Max-width changes nothing). Absolutely cannot figure out how to make the tooltip_text be responsive as it should be, or even figure out why it's the width it's appearing at other than the obvious left-right padding.</p>
  
  <p><a href="http://codepen.io/hitokage/pen/rxbBPB" rel="nofollow">http://codepen.io/hitokage/pen/rxbBPB</a></p>
  
  <pre><code>&lt;div class="singleControl tooltip"&gt;
      &lt;div class="tooltip_text"&gt;Hey this is some kind of tooltip letting you know some information! Hey this is some kind of tooltip letting you know some information! Hey this is some kind of tooltip letting you know some information! Hey this is some kind of tooltip letting you know some information!&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>