title: How to align to center md-hint in Angular Material 2?
body: <p>My snippet.</p>
  
  <pre><code>&lt;md-hint&gt;About&lt;/md-hint&gt;
  &lt;p data-text&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit.&lt;/p&gt;
  </code></pre>
  
  <p>View</p>
  
  <p><a href="https://i.stack.imgur.com/ZcMmZ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ZcMmZ.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/l3xn9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/l3xn9.png" alt="enter image description here"></a></p>
  
  <p>How to make the md-hint align to center? been stuck for a while..</p>
  
  <hr>
  
  <p><strong>Update</strong></p>
  
  <p>I did the css way. This is what I am avoiding to do.. If you know the angular material2 way to solve this please help.</p>
  
  <p><a href="https://i.stack.imgur.com/WMy1a.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WMy1a.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/gKuxs.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/gKuxs.png" alt="enter image description here"></a></p>