Use input and img (image) in css to align in the center of the same line

Put the input and img in the same line. The img label is always a header higher than the input, which is ugly. What I found most on the website is to add an align = "absmiddle" attribute to img. This method does seem feasible but does not comply with the HTML standard. Later, we found that we can add vertical-align: middle to both input and img:

The method used to align the input and img in the same row during css Writing:

Img {vertical-align: middle ;}

Input {width: width; height: height; line-height: consistent with height; margin: 0px; padding; 0px; font-size: font size; border: border; vertical-align: center ;}

Or write it like this.

Input, img {vertical-align: middle ;}