I am looking to update the appearance of an HTML table. Currently, it looks like this: https://i.sstatic.net/pueyW.png
Here is the code snippet:
<div className="student-schedule">
<table className="student-calendar-table">
[...]
</table>
And here is the associated CSS:
.student-th{
color: rgb(71, 71, 71);
}
[...]
.student-block {
cursor: pointer;
transition: background-color 0.3s;
text-align: center;
color: rgb(71, 71, 71);
}
[...] all that findCss
function does is handle the colors.
I have been struggling with two main issues:
- Ensuring uniform width for each column regardless of content.
- Creating space between each day column without cutting off left borders.
If you can help me achieve the desired layout shown in the screenshot below, I would greatly appreciate it: https://i.sstatic.net/NuAkd.png
[...]