кнопки центровки в форме

Question

Я хочу центрировать две кнопки в форме. Я получил обертку div вокруг них и попробовал маржу: 0 auto и float: left, но это не работает.

.button_container { 
width: auto; 
min-width: 834px; 
margin: 0 auto; 
float: left; 
} 

FIDDLE

Было бы идеально, если кнопки будут сосредоточены под текстовое поле. Это возможно?

ОБНОВЛЕНО:

Спасибо всем, я использовал Sachins скрипку, как он работал лучше для моей ситуации.

WORKING FIDDLE

Answer 1

Вам нужно сделать пару вещей, таких как Удалить float:left, добавить text-align:center и, самое главное, удалить min-wdith, поскольку он заставляет иметь ту ширину контейнера, которая делает его не центрированным.

.button_container { 
    width: 100%; 
/* min-width: 834px;*/ 
    margin: 0 auto; 
    text-align:center; 
} 

JS Fiddle Example

Answer 2

Добавить text-align:center; в .button_container делает его:

.button_container { 
width: auto; 
min-width: 834px; 
margin: 0 auto; 
float: left; 
text-align:center; 
} 

Это будет центр все внутри кнопки контейнера делает ваши кнопки сосредоточенные, как хотелось.

Answer 3

Попробуйте это:

.button_container { 
    width: auto; 
    min-width: 834px; 
    margin: 0 auto; 
    border:1px solid red; 
    text-align:center; 
} 

Граница была просто добавлена, чтобы проиллюстрировать размер DIV.

http://jsfiddle.net/LerVW/3/

Answer 4

Ну, я не могу сказать, что я одобряю используя <table>, но это было бы много работы, чтобы изменить сейчас, чтобы вы могли бы также использовать его. Просто добавьте еще одну строку, содержащую кнопки.

<tr> 
    <td>&nbsp;</td> 
    <td> 
     <button name="submit" class="submit_btn" type="submit">Absenden</button>&nbsp; 
     <button name="reset" class="submit_btn" type="reset">Zur&uuml;cksetzen</button> 
    </td> 
</tr> 

Это выглядит хорошо для меня сама по себе, но вы можете также оставил отступы на второй <td>.

http://jsfiddle.net/ExplosionPIlls/LerVW/2/

Answer 5

Одна вещь, которую вы можете сделать, если вы хотите, чтобы кнопки, сосредоточенные под textarea движется ваш button_container на новую строку на столе ...

Демо: http://jsfiddle.net/darkajax/WFh9S/

Answer 6

Fiddle

штраф

.button_container { 
    width: 100%; 
    margin: 0 auto; 
    text-align:center; 
} 

Другой стиль этого произведения: Fiddle

.box_wrapper { 
    margin: 0 auto; 
    height: auto; 
    width: 325px; 
    padding: 15px; 
    background: #ccc; 
}