Css 完全对齐所有输入字段

Css 完全对齐所有输入字段,css,angularjs,angularjs-material,Css,Angularjs,Angularjs Material,我希望将所有输入字段对齐到表中的一行中 目前我在一个表中有3个输入字段和2个选择字段。他们正在像这样展示 我希望所有的输入字段都在同一条直线上。 两个选择字段看起来都有上边距,但我没有在上面使用任何边距属性 这就是我用来显示这个的代码 <div class="content"> <div class="white-bg md-whiteframe-4dp"> <table class="dataTable row-bord

我希望将所有输入字段对齐到表中的一行中

目前我在一个表中有3个输入字段和2个选择字段。他们正在像这样展示

我希望所有的输入字段都在同一条直线上。 两个选择字段看起来都有上边距,但我没有在上面使用任何边距属性

这就是我用来显示这个的代码

<div class="content">

        <div class="white-bg md-whiteframe-4dp">
            <table class="dataTable row-border hover" datatable="ng" dt-options="vm.dtOptions">
                <thead>
                    <tr>
                        <th class="secondary-text">
                            <div class="table-header">
                                <span class="column-title">S.No.</span>
                            </div>
                        </th>
                        <th class="secondary-text">
                            <div class="table-header">
                                <span class="column-title">Material Group</span>
                            </div>
                        </th>
                        <th class="secondary-text">
                            <div class="table-header">
                                <span class="column-title">Estimated Quantity</span>
                            </div>
                        </th>
                        <th class="secondary-text">
                            <div class="table-header">
                                <span class="column-title">Discount Rate</span>
                            </div>
                        </th>
                        <th class="secondary-text">
                            <div class="table-header">
                                <span class="column-title">Currency</span>
                            </div>
                        </th>
                        <th class="secondary-text">
                            <div class="table-header">
                                <span class="column-title">Total Discount</span>
                            </div>
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="row in ::vm.tableData">
                        <td>
                            {{row.id}}
                        </td>
                        <td>

                            <md-input-container class="md-block">
                                <md-select ng-model="row.materialGroupName" placeholder="Weapon">
                                    <md-option value="null" selected disabled>Material Group Name</md-option>
                                    <md-option value="group1">Group 1</md-option>
                                    <md-option value="group2">Group 2</md-option>
                                    <md-option value="group3">Group 3</md-option>
                                </md-select>
                            </md-input-container>

                        </td>
                        <td>

                            <md-input-container class="md-block">
                                <input type="number" ng-model="row.quantity">
                            </md-input-container>

                        </td>
                        <td>

                            <md-input-container class="md-block">
                                <input type="number" ng-model="row.discountRate">
                            </md-input-container>


                        </td>
                        <td>

                            <md-input-container>
                                <md-select class="md-block" ng-model="row.currency">
                                    <md-option value="null" selected disabled>Select Currency</md-option>
                                    <md-option value="inr">INR</md-option>
                                    <md-option value="usd">USD</md-option>
                                    <md-option value="gbp">GBP</md-option>
                                </md-select>
                            </md-input-container>

                        </td>
                        <td>

                            <md-input-container class="md-block">
                                <input type="number" ng-model="row.total">
                            </md-input-container>

                        </td>
                    </tr>
                </tbody>
            </table>
        </div>

    </div>

没有。
材料组
估计数量
贴现率
通货
总折扣
{{row.id}}
物料组名称
第一组
第2组
第3组
选择货币
印度卢比
美元
英镑

我还尝试删除
md input container
附带的边距,但这对我无效。

检查select和input元素。其中一个或两个元素可能都添加了一些边距。请从“选择元素”中删除边距,并尝试将“td垂直对齐:顶部和等高”应用于“输入类型文本”和“选择元素”。