/* Source: https://dev.to/dcodeyt/creating-beautiful-html-tables-with-css-428l */ /* Styling the table */ .styled-table { border-collapse: collapse; margin: 25px 0; font-size: 0.9em; font-family: sans-serif; min-width: 400px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); } /* Styling the header */ .styled-table thead tr { background-color: #009879; color: #ffffff; text-align: left; } /* Add spaces */ .styled-table th, .styled-table td { padding: 12px 15px; } /* Table rows Add a bottom border to each row for separation Add a lighter background to every second row to help readability Add a dark border to the very last row to signify the end of the table */ .styled-table tbody tr { /* If you want your borders to look sharp on high resolution displays you can use `thin` instead of `1px` */ border-bottom: thin solid #dddddd; } .styled-table tbody tr:nth-of-type(even) { background-color: #f3f3f3; } .styled-table tbody tr:last-of-type { border-bottom: medium solid #009879; }