I know that this probably has something to do with the z-index but I can't seem to figure it out. The code snippet is:

<form method="get" action="http://www.google.com/search"> 
    <div> 
        <table border="0" cellpadding="0"> 
            <tr>
                <td> 
                    <input type="text" name="q" size="15" maxlength="255" value="" /> 
                    <input type="submit" value="GO" /></td></tr> <tr><td align="right" style="font-size:75%"> 
                    <input type="checkbox" name="sitesearch" value="<website_address>" checked /> SEARCH <br /> 
                </td>
            </tr>
        </table> 
    </div> 
</form>

I have tried creating a class, but it doesn't seem to affect it:

.search{
    z-index:absolute;
    
}
<form method="get" action="http://www.google.com/search"> <div class="search">

I haven't found too much information in making a search bar bring to the front and have experimented quite a bit. I could try to put the others bring-to-back but I'm really curious if there is a way to do bring-to-front for the search bar.