以表格为中心输入框

Question

我想让输入框保留在表单的中心，但即使使用margin: 0 auto;或display: inline-block;

我也无法使其工作

#message {
    width: 90%;
    ...
    margin: 0 auto;
}

Demo

Answer 1

margin: 0 auto仅适用于block元素，因此：

#message {
    margin: 0 auto;
    display:block;
}

JSFiddle

Answer 2

将text-align:center添加到#subform

Input充当inline-block元素，您可以align将text-align属性提供给父级

#subform {
  text-align: center;
}
#message {
  width: 90%;
  max-height: 25px;
  line-height: 27px;
  text-indent: 10px;
  font-size: 1em;
  color: #333;
  background: none repeat scroll 0% 0% #FFF;
  border-right: 1px solid #D9D9D9;
  border-width: 1px;
  border-style: solid;
  border-color: #C0C0C0 #D9D9D9 #D9D9D9;
  -moz-border-top-colors: none;
  -moz-border-right-colors: none;
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  border-image: none;
  margin: 0 auto;
}

<form id="subform" autocomplete="off">
  <input id="message" placeholder="message goes here" type="text">
</form>

Answer 3

试试这个简单的方法：

<form id="subform" autocomplete="off" style="text-align:center">
<input id="message" placeholder="message goes here" type="text">
</form>

Answer 4

尝试这种简单的方式 -

<input type="text" style="text-align:center;" >