Problems with alignment of different elements: bottom or middle alignment is required. _html/css_WEB-ITnose

<table>    <tr>        <td>            <input type="text" style="height:16px; width:27px" id="text1" />            <input type="image" src="images/logo.gif" style="height:16px; width:16px;" id="image1" />        </td>    </tr></table>

How to write a style to align image1 and text1 at the bottom (or middle)? ?

According to the above writing, the display position of image1 will always be higher than text1
(It seems that the bottom of image1 is aligned with the middle of text1. If the two elements are placed in different TDs, they should be aligned vertically. The style works again!).

According to the above writing method, how to set alignment using CSS?

Reply to discussion (solution)

Bottom alignment of image1 and text1:

<table>    <tr>        <td>            <input type="text" style="height:16px; width:27px" id="text1" />            <input type="image" src="images/logo.gif" style="height:16px; width:16px; vertical-align:bottom" id="image1" />        </td>    </tr></table>

It turns out that I added the wrong style, I kept going to TD None of them work. . .

Using css to control will eventually encounter compatibility issues. It is better to change the page.

<table>    <tr>        <td>            <input type="text" style="height:16px; width:27px" id="text1" />        </td>        <td>            <input type="image" src="images/logo.gif" style="height:16px; width:16px;" id="image1" />        </td>    </tr></table>