Question

我在我的网站tjsoldit.com的首页上有一个家庭搜索表单。表单不是由我编码的，它由我的家庭搜索房地产公司提供，我通过插入调用表单的两行脚本嵌入它。我只能在自定义css表中为表单设置一些自定义css规则，因为我提供了表单不同元素的css类。表单呈现在一个表中，其中包含所有搜索字段及其匹配标签的行。表格的结构可以在http://tjsoldit.com/wp-content/uploads/2013/02/4-columns.jpg看到。

正如您在结构中看到的，该按钮是表单第一列的元素。我想要的只是将按钮置于中心位置，使按钮位于其直线的水平中心（几乎是第2列的一半，第3列的一半）。我已尝试过所有显示属性，例如display:inline;，display:table等。但无法执行此操作。请帮忙。

搜索按钮的css类为：.ds-quick-search-button，表单字段类为.ds-quick-search-name，字段值类为.ds-quick-search-name，有关表单结构的更多内容可在此处阅读：www.diversesolutions.com/design-tips/idx-quick-search-styling-guide-6744

注意：我只提供了一个嵌入代码。所以不能改变HTML。我可以玩它的CSS。

Answer 1

添加colspan="4"（合并4个单元格）和align="center"

<tr>
<td colspan="4" align="center">
<input type="button" value="Search" class="ds-quick-search-button">
</td>
</tr>

或

为表创建一个外部div并将表格样式添加到外部div，增加填充值padding: 6px 24px 36px 24px;

然后尝试添加此

.ds-quick-search tr:last-child input{margin:2% 0 0 25%; position:absolute; }

<强> DEMO 2

在第1列和第1列之间留出空间。 2和3之间4

.ds-quick-search td:first-child{padding-right:15px} .ds-quick-search td:nth-child(3){padding-right:15px}

Answer 2

设置按钮50%的边距，如下所示：

.ds-quick-search-button { 
   margin-left:50%;
}

如何将css按钮放在四个表列的中心（水平）中

2 个答案: