Show Dates of Other Months

27 Aug 20261 minute to read

The following example demonstrates how to show the hidden dates of other months using CSS styles.

.e-calendar .e-content tr.e-month-hide,
.e-calendar .e-content td.e-other-month>span.e-day {
    display: block;
}

.e-calendar .e-content td.e-month-hide,
.e-calendar .e-content td.e-other-month {
    pointer-events: auto;
    touch-action: auto;
}
@Html.EJS().Calendar("element").Render()

<style>

    .e-calendar .e-content tr.e-month-hide, /* csslint allow: adjoining-classes*/
    .e-calendar .e-content td.e-other-month > span.e-day { /* csslint allow: adjoining-classes*/
        display: block;
    }

    .e-calendar .e-content td.e-month-hide, /* csslint allow: adjoining-classes*/
    .e-calendar .e-content td.e-other-month { /* csslint allow: adjoining-classes*/
        pointer-events: auto;
        touch-action: auto;
    }
</style>

View Sample in GitHub.