CODEWITHSUNDEEP
javascriptcssangularjsdatepickerangular-material
yevg
yevg

Reputation: 1966

Angular Materials - md-datepicker display issue on large browser

Im using md-datepicker in my app but it doesnt display right for larger browser widths. Seems to only work as intended for small and x-small widths. Please see screenshot attached.

This happens on Chrome and Safari.

HTML:

<md-datepicker ng-model="data" md-placeholder="mm/dd/yyyy"></md-datepicker>

enter image description here

Ive tried narrowing down the problem using inspector and it may have something to do with the left property value on the md-datepicker-calendar-pane class, but Im not sure.

enter image description here

Upvotes: 3

Views: 718

Answers (2)

noob
noob

Reputation: 81

I had this issue. table width was set globally as 100% in an app. The following fixed it:

.md-datepicker-calendar-pane table {
  width: auto;
}

Upvotes: 2

Rob
Rob

Reputation: 11

Check your css

I had something like this which was causing your exact issue

table {border-collapse: collapse; width: 100%;}

Upvotes: 1

Related Questions