简单的 HTML 格式问题

Question

我有一个非常简单的格式问题。我的问题是，从下面的屏幕截图中，如何消除 "Recruiter" 上方 space 和 "First Name" 下方以黄色突出显示的 space？

我的HTML代码是：

<table border="1" width="100%">
    <tr>
        <td width="15%">    <%--Labels--%>
            <table>
                <tr><td><asp:Label runat="server" ID="lblRecruiter" Text="Recruiter"></asp:Label></td></tr>
                <tr><td><asp:Label runat="server" ID="lblRecruiterFirstName" Text="First Name"></asp:Label></td></tr>
                <tr><td><asp:Label runat="server" ID="lblAccountManager" Text="Account Mangaer"></asp:Label></td></tr>
                <tr><td><asp:Label runat="server" ID="lblAccountManagerFirstName" Text="First Name"></asp:Label></td></tr>
                <tr><td><asp:Label runat="server" ID="lblClientCompany" Text="Client"></asp:Label></td></tr>
                <tr><td><asp:Label runat="server" ID="lblHiringManagerFirstName" Text="First Name"></asp:Label></td></tr>
            </table>
        </td>
        <td width="85%">    <%--Text Fields--%>
            <table>
                <tr><td><asp:DropDownList runat="server" ID="ddlRecruiter"></asp:DropDownList></td></tr>
                <tr><td><asp:TextBox runat="server" ID="txtRecruiterFirstName"></asp:TextBox></td></tr>
                <tr><td><asp:DropDownList runat="server" ID="ddlAccountManager"></asp:DropDownList></td></tr>
                <tr><td><asp:TextBox runat="server" ID="txtAccountManagerFirstName"></asp:TextBox></td></tr>
                <tr><td><asp:TextBox runat="server" ID="txtClientCompany"></asp:TextBox></td></tr>
                <tr><td><asp:TextBox runat="server" ID="txtHiringMangaerFirstName"></asp:TextBox></td></tr>
            </table>
        </td>
    </tr>
</table>

Answer 1

使用检查元素查看是否有任何东西在扩展其高度，否则，只需将边距和填充设置为 0，或者尽可能设置高度。

Answer 2

我假设您希望左侧的文本与右侧的字段对齐。不要让它们成为两个单独的 table，你应该让一个 table 有 2 列。这是第一行的样子：

<table>
    <tr>
    <td width="15%"><asp:Label runat="server" ID="lblRecruiter" Text="Recruiter"></asp:Label></td>
    <td width="85%"><asp:DropDownList runat="server" ID="ddlRecruiter"></asp:DropDownList></td>
    </tr>

您所拥有的问题是每个 table（左侧和右侧）都根据其内容进行布局，并且右侧的项目比文本行高。左侧 table 的结果默认居中对齐，因此您可以在上方和下方看到间隙。

简单的 HTML 格式问题

Simple HTML formatting issue

html

format