AngularJS材料日期选择器未对齐

时间:2018-01-23 02:04:57

标签: css angularjs

我有一个按钮和角度js材料日期选择器连续。日期选择器未正确对齐。我也尝试添加保证金。如果不使用额外的CSS文件(添加行css),请帮助我对齐这些组件。

  <div>
<md-button class="md-raised md-button job-export-jobs md-ink-ripple">Export Jobs Date</md-button>
<md-input-container>
  <label for="jobDate">Export date</label>
  <md-datepicker  
  ng-model="model.exportJobsDate">
  </md-datepicker>
</md-input-container>

1 个答案:

答案 0 :(得分:1)

您可以使用 layout="row" 然后 flex 来提供分发

<div class='calendarDiv' layout="row">
    <div flex=40>
      <md-icon style="position:absolute;margin-top:15px; left:20px" md-svg-src="calendar.svg"></md-icon>
      <md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>
    </div>
    <div flex=60>
      <md-button class="md-raised md-button job-export-jobs md-ink-ripple">Export Jobs Date</md-button>
    </div>
  </div>

<强> DEMO

相关问题