如何更改 ngx-daterangepicker-material 下拉日历的样式

Question

I need to change some of the styling of the calendar like top, left and width. How do I do that?

This here is my date range picker. Adding a class to it and adding style in it does not update the drop down calendar.

<div>
    <input type="text"
    ngxDaterangepickerMd
    [(ngModel)]="selected"
    [showCustomRangeLabel]="true"
    [ranges]="ranges"
    [showClearButton]="true"
    [showCancel]="true"
    [maxDate]="maxDate"
    [minDate]="minDate"
    [linkedCalendars]="true"
    (datesUpdated)="datesUpdated($event)"
    readonly/>
</div>

Answer 1

As directive will place the content for the calendar. You can hack those classes which comes with the content. As main div of that content is having a class md-drppicker, you can use this class to update the style in styles.css file.

.md-drppicker {
  top:0;
}