I have a very simple situation that I can't for some reason resolve. In ASP.NET I am trying to align the textbox inside the inline table with the text so that the text will point at the middle of the textbox, not at its foundation
Here is the markup
<span style="margin-bottom:10px">This is the text</span>
<table border="1">
<tr>
<td style="vertical-align:bottom;padding: 0; margin: 0;">
<input name="TextBox1" type="text" id="TextBox1" />
</td>
</tr>
</table>
Here is the css
.inlineTable {
display: inline-table;
padding: 0;
border-spacing: 0;
border-collapse: collapse;
}
Here is how it looks
As it is seen in the attachment, the text points at the base. How can I move the textbox a bit down so that the text would point to the middle of the left side?
Thank you very much in advance
CodePudding user response:
try vertical-align:middle on the table
.inlineTable {
display: inline-table;
padding: 0;
}
table{
vertical-align:middle;}
<span >This is the text</span>
<table border="1">
<tr>
<td style="vertical-align:middle;padding: 0; margin: 0;">
<textarea ID="TextBox1">hi</textarea>
</td>
</tr>
</table>