html - 选择框溢出 td

Question

在我的表中，我有一些带选择框的 td。用户点击的那个变成了一个真正的选择框(size="n")而不是下拉列表。

但我不想让表格 td 改变它的高度。

<table><tr>
    <td>
    <select size="1">
        <option>one</option>
        <option>two</option>
        <option>duck</option>
    </select>
    </td>

    <td>
    <select size="1">
        <option>one</option>
        <option>two</option>
    </select>
    </td>

    <td>
    <select size="5">
        <option>one</option>
        <option>two</option>
        <option>yes</option>
        <option>batman</option>
        <option>chewing gum</option>
    </select>
    </td>

    <td>
    <select size="1">
        <option>one</option>
        <option>two</option>
        <option>monitor</option>
    </select>
    </td>
</tr></table>

例如:它的外观:

我想要什么:

Answer 1

这是 WORKING SOLUTION

HTML:

<div class="back">
<table border="0"><tr>
    <td>
    <select size="1">
        <option>one</option>
        <option>two</option>
        <option>duck</option>
    </select>
    </td>

    <td>
    <select size="1">
        <option>one</option>
        <option>two</option>
    </select>
    </td>

    <td>
    <select size="5">
        <option>one</option>
        <option>two</option>
        <option>yes</option>
        <option>batman</option>
        <option>chewing gum</option>
    </select>
    </td>

    <td>
    <select size="1">
        <option>one</option>
        <option>two</option>
        <option>monitor</option>
    </select>
    </td>
</tr></table>
</div>

CSS:

td{vertical-align:top;}
.back{background:green; height:28px; display:inline-block}

希望这对您有所帮助。

PS:我用了绿色背景而不是你的粉红色。你可以替换它。