10

I'm currently switching over to Bootstrap 3 from bootstrap 2. How do you center the input field in Bootstrap 3? The text centers correctly. It used to work for BS2. I have tried moving the 'style='text-align:center' in div's but still no luck.

JSfiddle

Updated fiddle with answer

    <div id="Email_Alert_Modal" class="modal show" tabindex="-1" role="dialog" data-keyboard="false" data-backdrop="static">
    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header" style="text-align: center">
               <h3>Email Alert</h3>
            </div>

            <div class="modal-body"  style="text-align: center">
                    <h4>Please enter email address that the alert will be sent to.</h4>
                    <label  for="send_email"> </label> <input style="width:200px" type="email"  class="form-control" name="email" id="send_email" placeholder="johndoe@yahoo.com"  title="Input Email Address">
            </div>

            <div class="modal-footer">
              <button class="btn btn btn-primary" onclick='Email_Alert()' >Send</button>
              <button class="btn btn btn" data-dismiss="modal" >Cancel</button>
            </div>
        </div>
    </div>
</div>
fat fantasma
  • 7,483
  • 15
  • 48
  • 66
  • Maybe try the inline style on the div instead of button. – Blynn Sep 09 '13 at 18:30
  • 1
    This question received a lot of attention, and although not asked the same thing, gotten relevant responses: http://stackoverflow.com/questions/9184141/how-do-you-get-centered-content-using-twitter-bootstrap – Oded Ben Dov Aug 21 '14 at 13:53

1 Answers1

13

Set 

margin: 0 auto;

for input element

Jakub Matczak
  • 15,341
  • 5
  • 46
  • 64
  • Yup - also don't forget the semi-colon after the width! – itamar Sep 09 '13 at 18:39
  • Ugh! You go on vacation for 1 week and forget stupid stuff like this. Thanks for refreshing my memory :) I put a new fiddle with the answer. thanks again. – fat fantasma Sep 09 '13 at 18:54