Html 无法将下拉列表与angular2+;中的下一行对齐;

Html 无法将下拉列表与angular2+;中的下一行对齐;,html,angular,html-select,dropdown,Html,Angular,Html Select,Dropdown,我想将下拉列表与表格中的下一行对齐,但无法对齐。 我试着打破标签- 我试过div标签- 但一切都无济于事 请帮忙 这是截图- 代码- component.html <table> <tr> <td> <div style="margin-left:50px"> <div> barchart success data - {{barChartDataKarzaEntire[0]

我想将下拉列表与表格中的下一行对齐,但无法对齐。 我试着打破标签-
我试过div标签-

但一切都无济于事

请帮忙

这是截图-

代码-

component.html

  <table>
   <tr>
    <td>
    <div style="margin-left:50px">

      <div> barchart success data -   
       {{barChartDataKarzaEntire[0].data[0]}}      </div>
      <div> barchart error data
      {{barChartDataKarzaEntire[1].data[0]}}        
      </div>

      <p> Karza Success and Error
      </p>


        <form (ngSubmit)="viewKarzaData(karzaValue)"          
        [formGroup]="karzaDataForm">

        <div class="form-group">

          <div>
          <label> Karza Bar C Name: </label>
        </div>
          <br>
          <br>
          <div>
          <select style="width:240px" class="form-control" 
          name="viewKarzaDataName" 
         [formControl]="karzaDataForm.controls['viewKarzaDataName']"
            [(ngModel)]='karzaValue' placeholder="Choose an Option" 
          (change)="viewKarzaData(karzaValue)">
            <option value="">Select</option>
            <option *ngFor='let i of karzaInterfaceNames'>{{i}}</option>
          </select>
        </div>
          <br>
          <br>

          <div class="card">
            <div class="card-header">

              Karza Bar Chart

            </div>



      //code 

      </td>
     </tr>
      </table>

条形图成功数据-
{{BarChartDatakarzaThrough[0]。数据[0]}
柱状图误差数据
{{BarChartDatakarzaThrough[1]。数据[0]}
卡扎成功与错误

Karza Bar C名称:

挑选 {{i}

卡扎条形图 //代码
您可以使用css:

<table>
    <tr>
        <td>
            <div style="margin-left:50px">

                <div> barchart success data -
                    {{barChartDataKarzaEntire[0].data[0]}}
                </div>
                <div> barchart error data
                    {{barChartDataKarzaEntire[1].data[0]}}
                </div>

                <p> Karza Success and Error
                </p>


                <form (ngSubmit)="viewKarzaData(karzaValue)"
                      [formGroup]="karzaDataForm">

                    <div class="form-group">

                        <div class="label-container">
                            <label> Karza Bar C Name: </label>
                        </div>
                        <br>
                        <br>
                        <div class="select-container">
                            <select style="width:240px" class="form-control"
                                    name="viewKarzaDataName"
                                    [formControl]="karzaDataForm.controls['viewKarzaDataName']"
                                    [(ngModel)]='karzaValue' placeholder="Choose an Option"
                                    (change)="viewKarzaData(karzaValue)">
                                <option value="">Select</option>
                                <option *ngFor='let i of karzaInterfaceNames'>{{i}}</option>
                            </select>
                        </div>
                        <br>
                        <br>

                        <div class="card">
                            <div class="card-header">

                                Karza Bar Chart

                            </div>


                            //code
                        </div>
                    </div>
                </form>
            </div>
        </td>
    </tr>
</table>

你能做一次闪电战吗?
.form-group {
    margin-bottom: 1rem;
    display: flex;
}
.label-container{
    width:10%;
}
.select-container{
    width:40%
}
.card{
    width:50%;
}