2

我的网站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。

4

2 回答 2

3

添加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; }

演示 2

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

.ds-quick-search td:first-child{padding-right:15px}
.ds-quick-search td:nth-child(3){padding-right:15px}
于 2013-02-05T09:43:10.267 回答
0

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

.ds-quick-search-button { 
   margin-left:50%;
}
于 2013-02-05T09:42:20.317 回答