title: Placing a tooltip on the left instead of on the right over a button
body: <p>I'm trying to place a tooltip of a button on the left instead of on the right.</p>
  
  <p>On the left:</p>
  
  <p><a href="https://i.stack.imgur.com/kZr99.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/kZr99.png" alt="enter image description here"></a></p>
  
  <p>Toolbar:
  </p>
  
  <pre><code>$('#divToolbar').css({
          'top': '0%',
          'left': '0%',
          'z-index': '100',
          'position': 'absolute'
  });
  </code></pre>
  
  <p>Tooltip:</p>
  
  <pre class="lang-css prettyprint-override"><code>.toolbar-vertical-group &gt; .adsk-button &gt; .adsk-control-tooltip 
  {
       left: 120%;
       bottom: 25%;
  }
  </code></pre>
  
  <p>But on the right:</p>
  
  <p><a href="https://i.stack.imgur.com/WyGlw.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WyGlw.png" alt="enter image description here"></a>
  </p>
  
  <pre><code>  $('#divToolbar').css({
          'top': '0%',
          'left': '96%',
          'z-index': '100',
          'position': 'absolute'
      });
  </code></pre>
  
  <pre class="lang-css prettyprint-override"><code>.toolbar-vertical-group &gt; .adsk-button &gt; .adsk-control-tooltip {
      left: -120%;
      bottom: 25%;
  }
  </code></pre>
  
  <p>It gets cut by the edge of the screen. I tried to add some paddings or margins but that didn't seem to help..</p>
  
  <p>The toolbar should be on the right edge of the screen.</p>