Php 将悬停图像定位到桌子之前

我正在尝试在我的桌子上方放置一个图像&悬停图像。我试图摆弄css的位置，比如绝对/相对/固定/静态。但不知何故，它要么出现在表格的顶部，要么将表格推到页面的底部

我如何将图像放在桌子上方

CSS:

.searchbutton{
位置：相对位置；
排名前10%；
左：40%；
显示：块；
宽度：450px；
高度：450px；
背景图像：url（“”）；
背景重复：无重复；
}
.搜索按钮：悬停{
位置：相对位置；
排名前10%；
左：20%；
显示：块；
宽度：450px；
高度：450px；
背景图像：url（“”）；
背景重复：无重复；
}

PHP:

---

您需要将表放入div容器中，并添加位置：相对于它。对于图像，您需要一个位置：绝对以使其覆盖桌子

HTML:

---

您需要将表放在div容器中，并添加位置：相对于它。对于图像，您需要一个位置：绝对以使其覆盖桌子

HTML:

---

我们需要一个输出HTML和CSS的演示。PHP在这里对我们没有多大用处。谢谢，我将改用css样式。。。更好的是，我们需要一个输出HTML和CSS的演示。PHP在这里对我们没有多大用处。谢谢，我将改用css样式。。。好多了

.searchbutton {
position: relative;
top: 10%;
left: 40%;
display: block;
width: 450px;
height: 450px;
background-image: url('<?php echo $searchpic;?>');
background-repeat:no-repeat;
}

.searchbutton:hover {
position: relative;
top: 10%;
left: 20%;
display: block;
width: 450px;
height: 450px;
background-image: url('<?php echo $searchhoverpic;?>');
background-repeat:no-repeat;
}

<?php

include 'database_conn.php';    

$sql = "SELECT tablename.ID, tablename.Title, tablename.Year, tablename2.catDesc,tablename.catID
            FROM tablename
            LEFT JOIN tablename2 ON tablename.catID=tablename2.catID"; 

$queryresult = mysqli_query($conn, $sql)
or die (mysqli_error($conn));       


    echo '<table cellpadding="0" cellspacing="0" class="db-table" table align="center">';
    echo"<tr><th>Title</th><th>Year</th><th>Category</th>  </tr>"; 

while($row = mysqli_fetch_assoc($queryresult)) {
    $iCDID = $row['ID'];
    $CDTitle = $row['Title'];
            $CDYear = $row['Year'];
            $CDCatID = $row['catID'];

            echo "<tr><td>"; 
            echo "<div> <a href = \"editCDForm.php?itemCode=$iCDID\">$CDTitle</a> </div>\n";
            echo "</td><td>";   
            echo $row['Year'];
            echo "</TD></tr>"; 
}

    echo "</table>"; 

mysqli_free_result($queryresult); 
mysqli_close($conn);
?>

<div class="outer">
  <div class="image"></div>
  <table>
    <tr>
      <td>a</td>
      <td>b</td>
      <td>c</td>
    </tr>
  </table>

.outer {
  position:relative;
}
.image {
  position:absolute;
  top:0;
  left:0;
  width:100px;
  opacity:0.4;
  height:100px;
  background:red;
}