Размещение метки центра формы в twitter bootstrap

Question

Я очень новичок в twitter bootstrap, и я изо всех сил пытаюсь разместить свои формы в центре.

У меня есть код, как это здесь:

<div class="row"> 
    <div class="pagination-centered"> 
     <br/><br/><br/><br/> 
     <form action="/payment-init" method="POST"> 
      <fieldset> 
      <legend>Merchant CheckOut Page</legend> 
      <label>Product Name</label> 
      <input type="text" placeholder="Type something..." name="productName" value="Samsung Mobile Phone"/> 
      <label>Amount</label> 
      <input type="text" placeholder="Enter the amount in rupees..." name="amount" required="true" /> 
      <label>Merchant Name</label> 
      <input type="text" placeholder="Merchant name" name="merchantId" required = "true" /> 
      <label>Customer Email</label> 
      <input type="text" placeholder="test@gmail.com" name="email" required = "true" /> 
      <br> 
      <button type="submit" class="btn">Submit</button> 
      </fieldset> 
     </form> 
    </div> 
</div> 

Выход это выглядит, как показано ниже:

Я хочу, чтобы переместить label (т.е. название продукта, сумма и т.д.) в левый верхний угол текстового поля. Это возможно?

Заранее спасибо.

Answer 1

Попробуйте float: left; text-align: left; Если это не помогает поставить некоторые CSS код в пост :) Я не могу сказать, форму исправления, скриншот :)

Answer 2

Чтобы поместить ярлык на левом верхнем углу каждого текстового поля вам нужно также чтобы каждое текстовое поле заполняло всю доступную ширину. Так, сделайте следующее:

.pagination-centered label { 
    text-align:left; 
} 

.pagination-centered input { 
    width: 100%; 
}