CSS在div中正确的子div对齐方式

Question

关于我的CSS样式，我有下一个问题：

http://s8.postimg.org/p26jl39fp/Screenshot_571.png

我希望在表单中间对齐输入(每个输入都放在自己的div中)。

表单的HTML标记：

http://ideone.com/lWYswC (只是发布了没有文档类型等的表单内容，因为网页没有其他div，并且这个代码块是我的html文档中唯一的主体)。

它的CSS样式：

http://ideone.com/w97FzB

html & body默认定义为width/height = 100%

html, body
{
    width: 100%;
    height: 100%;
    ...

来自Chrome浏览器devtools的屏幕截图：

http://s8.postimg.org/azq6a53t1/Screenshot_572.png

如你所见，输入已经超过了div大小，我不知道为什么。

另外，我在UI中使用了bootstrap库，它也包含在项目中。但是当我查看bootstrap的源代码时，他们没有为他们的控件使用任何对齐属性。他们只是有一些CSS样式的边框半径和蓝色突出显示。

如何解决此问题？

谢谢

Answer 1

非常简单：

input { margin: 0 auto; display: block; }