title: change the height of ui.bootstrap.alert
body: <p>I'm trying to add ui.bootstrap.alert based on this example: <a href="https://plnkr.co/edit/?p=preview" rel="noreferrer">https://plnkr.co/edit/?p=preview</a>. </p>
  
  <p>It works okay as following except that it's too big for me.
  <a href="https://i.stack.imgur.com/WljqG.png" rel="noreferrer"><img src="https://i.stack.imgur.com/WljqG.png" alt="enter image description here"></a></p>
  
  <p>So I changed the height in CSS and here's the new output</p>
  
  <pre><code>.alert {
    margin-bottom: 1px;
    height: 30px;
  }
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/6fY6A.png" rel="noreferrer"><img src="https://i.stack.imgur.com/6fY6A.png" alt="enter image description here"></a>
  But now the sentance is not in the middle of the alert anymore.</p>
  
  <p>How can I properly change the height of the alert? Thanks!</p>