表格中按钮之间的 HTML 空间

Question

我创建了一个表，其中每行包含两个按钮，并且两个按钮连接在一起，我想将两个按钮分开。我用过 不起作用，css 也是，这是他们的另一种方式。

我有另一个问题，因为我不想在表格边框内显示操作按钮，而是在靠近表格的地方显示。

<table style="border:2px solid white; cellpadding=10 cellspacing=0">
    <tr style="background:#00B050;color:#fff;">
	
        <th>Name</th>
        <th>Image</th>
        <th>Description</th>
        <th>Contact Renter</th>
        <th>Rent price</th>
		<th>Action</th>
    </tr>

<?php
    while($row = mysql_fetch_array($result)) {
?>
    <tr>
        <td><?php echo $row['productname'];?></td>
        <td><img src='./images/products/<?php echo $row["productimage"];?>' width='150' height='100' alt=''></td>
        <td><?php echo $row['productdescription'];?></td>
        <td><?php echo $row['rentersdetails'];?></td>
        <td><?php echo $row['rentprice'];?></td>
		<td>
     <input class="button_normal" type="button" value="Find Renter" onclick="window.open('https://www.google.co.uk/maps/')"/>
	 <input class="button_normal" type="button" value="Mail Renter" onclick="window.open('mailto:')"/>
  </td>   
    </tr>
<?php

Answer 1

好的，如果我理解正确的话，您希望按钮位于表格的“外部”。您可以通过定位最后一个 th 和 td 并删除边框和背景颜色(只是隐藏 th)来实现这一点。它仍会在表格中，但看起来不会像那样。

在下面经过编辑的片段中，您可以看到我添加了一些内联样式。最好使用外部样式表，因此请确保以正确的 th 和 input 为目标!查看:nth-child() -选择器作为可能的解决方案。

<table style="border:2px solid white; cellpadding=10 cellspacing=0">
    <tr style="background:#00B050;color:#fff;">
	
        <th>Name</th>
        <th>Image</th>
        <th>Description</th>
        <th>Contact Renter</th>
        <th>Rent price</th>
		<th style="display:none">Action</th>
    </tr>

<?php
    while($row = mysql_fetch_array($result)) {
?>
    <tr>
        <td><?php echo $row['productname'];?></td>
        <td><img src='./images/products/<?php echo $row["productimage"];?>' width='150' height='100' alt=''></td>
        <td><?php echo $row['productdescription'];?></td>
        <td><?php echo $row['rentersdetails'];?></td>
        <td><?php echo $row['rentprice'];?></td>
		<td style="min-width:200px">
     <input class="button_normal" type="button" value="Find Renter" onclick="window.open('https://www.google.co.uk/maps/')"/>
	 <input style="margin-left:20px" class="button_normal" type="button" value="Mail Renter" onclick="window.open('mailto:')"/>
  </td>   
    </tr>
<?php

这一切都是用非常基本的 CSS 解决的，所以如果你对此有困难，我会认真考虑在线学习一些 CSS 教程!