如何水平居中一个DIV(How to horizontally center a DIV)

我怎么能水平中心与文本框和按钮此URL的DIV： http://tinyurl.com/d4lpyh5 ？

问候，凯文·

Answer 1:

第10行，你应该宽度添加到div：更改

<div style="margin-left: auto; margin-right: auto;">

至

<div style="margin-left: auto; margin-right: auto;width: 700px;">

编辑：如果你这样说，你就必须改变输入元素为固定的像素值，而不是宽度width: 30%;

Answer 2:

试试这个。

<center>
<input type="text" />
</center>

Answer 3:

保证金左：自动; 和余量右：汽车，其结果是该元件的中心划分剩余宽度在它们之间的一半。这让你更接近，但它不是一切。（不幸的是它不改变外观哪怕是一点点，虽然它是正确的。）

该元件不看还为中心的理由是该元素是默认的容器/屏幕的整个宽度。因此，为了使水平中心工作，你不仅需要指定左，右页边距的汽车，但走的更远，并明确设置元素的宽度。

一想可以指定类似“宽：最低需要;” 所以它会自动调整到任何它包含了......但有没有这样的事情在CSS。我所知道的唯一途径是明确指定的方式，是有道理的，你知道什么是它的内容元素的宽度。

所以在这里下面的例子是修改代码，以便它看起来像我的，你的愿望是什么的理解（有可能是在这里额外的<div>，你可能要封装样式表中的信息...但你的想法）：

<html>
<head>
<title>Page</title>
<link rel="stylesheet" href="http://145.120.12.115/project/css/main.css"></link>
<meta name="viewport" content="width=device-width" />
</head>
<body>
<div class="top"></div>
<div class="search">
    <div style="margin-left: auto; margin-right: auto; width: 40ex;">
      <input type="text" id="q" name="q" value="" style="width: 30ex;"/>
      <input type="submit" class="blueButton button" value="Search" />
    </div>
</div>
</body>
</html>