在html input type = button顶部添加图标图像

Question

I need to add an .PNG image on top of my css button, the image will be a hamburger menu icon to show that the button is expandable.

These are my buttons.

The buttons are created with this HTML:

                    While($row1=mysql_fetch_array($retServerNames)){

                        $serverID = $row1['id'];
                        $serverName = $row1['servername'];



                        echo"<input type='button' id='$buttonId' class='btn' name='show' value='".$serverName."' onclick='javascript:showServer(".$buttonId.");'
                            style='width: 90%; margin: 1%; text-align:left;'>";

                        echo"<div id='$serverName' style='margin: 3%; display:none;'>";

                        echo"<table style='border-bottom: 1px solid black;' cellspacing='10px'>

                                            <thead>
                                                <tr>
                                                    <th></th>
                                                    <th>Task</th>
                                                    <th>Status</th>
                                                    <th>Agent</th>
                                                    <th>Date Completed</th>
                                                    <th></th>
                                                </tr>
                                            </thead>";      

I have tried putting both the image tag and the input type inside a div element and tired to position the image over the button with no success, is there a better way to do this? or can any one suggest an alternative element that will allow me to do this more easily than the button element? thank you in advance.

Answer 1

The easy way is to use an actual button element.

<button type="button"
        id="<?php echo htmlspecialchars($buttonId); ?>"
        onclick="showServer(this.id);">
    <img src="hambuger.png" alt="">
    <?php echo htmlspecialchars($serverName); ?>
</button>