Html 字段集元素的垂直对齐

Html 字段集元素的垂直对齐,html,css,vertical-alignment,fieldset,Html,Css,Vertical Alignment,Fieldset,在对CSS进行了大量的修改之后,我成功地使表单元素正确排列。不幸的是,我一辈子都不知道如何修复标签/图像的位置错误。我希望它们在选择框旁边居中排列,但它们在选择框顶部对齐,到目前为止,我尝试过的方法都不起作用 <fieldset style="width:62%; float:left; margin-left: 19%;"> <label style="width: float: left;"&

在对CSS进行了大量的修改之后,我成功地使表单元素正确排列。不幸的是,我一辈子都不知道如何修复标签/图像的位置错误。我希望它们在选择框旁边居中排列,但它们在选择框顶部对齐,到目前为止,我尝试过的方法都不起作用

                <fieldset style="width:62%; float:left; margin-left: 19%;">

                        <label style="width: float: left;">Type</label>
                        <select style="width:40%; float: left;">
                            <option>Motherboard</option>
                            <option>Memory</option>
                            <option>Processor</option>
                        </select>

                        <label style="width:auto; float: left;">Item</label>
                        <select style="width:40%; float: left;">
                            <option>Motherboard</option>
                            <option>Memory</option>
                            <option>Processor</option>
                        </select>

                        <a href="#"><img src="images/icn_trash.png" style="width:auto; float: left;"></a>
                        <a href="#"><img src="images/icn_new_article.png" style="width:auto; float: left;"></a>

                </fieldset><div class="clear"></div>


类型
主板
记忆
处理器
项目
主板
记忆
处理器
更新

将其更改为使用表时,显示如下所示

                    <div id="inv1" class="inventory" style="margin:0; padding:0;">
                        <fieldset style="width:62%; float:left; margin-left: 19%;">

                        <table style="width:100%">
                        <tr>

                            <td style="width:5%;"><label style="width:auto;">Type:</label></td>
                            <td><select style="width:100%;">
                                <option>Motherboard</option>
                                <option>Memory</option>
                                <option>Processor</option>
                            </select></td>

                            <td style="width:5%;"><label style="width:auto;">Item:</label></td>
                            <td><select style="width:100%;">
                                <option>Motherboard</option>
                                <option>Memory</option>
                                <option>Processor</option>
                            </select></td>

                            <td><a href="#"><img src="images/icn_trash.png" style="width:auto;"></a></td>
                            <td><a href="#" class="btnAddInventory"><img src="images/icn_new_article.png" style="width:auto;"></a></td>

                        </tr>
                        </table>

                        </fieldset><div class="clear"></div>
                    </div>


类型:
主板
记忆
处理器
项目:
主板
记忆
处理器

我建议您使用有4列的表。


也许你有另一个与字段样式相交的css

我刚刚添加了一个表格,并在TD单元格上设置了“垂直对齐:中间;”,它仍然做着完全相同的事情。你在第一个标签类型中的css样式有错。我只是用一个屏幕截图和我的代码更新了原始帖子,当它使用表格设置时。我没有在粘贴的代码中设置“垂直对齐:中间;”,但是不管有没有设置,它都是一样的。非常感谢,这就是问题所在。我正在对CSS进行更改,但一旦您提到这一点,我与Inspect进行了检查,并注意到由于某种原因(仍然不知道为什么),我对CSS文件所做的更改没有被读取。我只是暂时通过Style覆盖了标签上的边距,效果非常好。