title: How to align the text middle of BUTTON
body: <p>Can you anyone please help me to code this below one</p>
  
  <p>This is my current code</p>
  
  <pre><code>&lt;div id="loginBtn" class="loginBtn"&gt;&lt;span&gt;Log in&lt;/span&gt;&lt;/div&gt;
  </code></pre>
  
  <p>div tag have loginBtn class and span tag having "log in" text in html page</p>
  
  <pre><code>.loginBtn {
      background:url(images/loginBtn-center.jpg) repeat-x;
      width:175px;
      height:65px;
      margin:20px auto;
      border-radius:10px;
      -webkit-border-radius:10px;
      box-shadow:0 1px 2px #5e5d5b;
  }
  </code></pre>
  
  <p>I created the button using 1px image. Now i am unable to place the "log in" text middle of the image can any one help me complete the code</p>
  
  <p>text is displaying left top corner. Please help me.</p>