My goal is to create a calendar with fixed width and height, where if the content within a day exceeds the allotted space, a scroll bar will appear inside that specific day.
I have been attempting to restrict the height of each day on the calendar, but allow for a scroll bar to appear if the content overflows beyond that limit. Here is my current code:
td {
border: 1px solid #ccc;
text-align: center;
vertical-align: top;
padding: 10px;
height: 100px;
}
When I tried adding a scroll bar using display: block; and overflow-y: scroll;, it did not achieve the desired outcome:
td {
border: 1px solid #ccc;
text-align: center;
padding: 10px;
height: 100px;
display: block;
overflow-y: scroll;
}
The result was not what I expected:
https://i.sstatic.net/x4zTs.png
Therefore, I am seeking advice on how to properly add a scroll bar to days with content that exceeds the set height limit.