tables.css 795 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. /* Table Styling */
  2. .table-wrapper {
  3. overflow-x: auto;
  4. }
  5. table {
  6. width: 100%;
  7. border-collapse: collapse;
  8. text-align: left;
  9. }
  10. th, td {
  11. padding: 12px;
  12. border: 1px solid #ddd;
  13. }
  14. th {
  15. background-color: #6c63ff;
  16. color: white;
  17. font-weight: normal;
  18. }
  19. tr:nth-child(even) {
  20. background-color: #f9f9f9;
  21. }
  22. tr:hover {
  23. background-color: #f1f1f1;
  24. }
  25. /* Responsive adjustments */
  26. @media (max-width: 768px) {
  27. body {
  28. height: auto;
  29. padding: 20px;
  30. }
  31. h2 {
  32. font-size: 1.5rem;
  33. }
  34. table {
  35. font-size: 14px;
  36. }
  37. th, td {
  38. padding: 10px;
  39. }
  40. }
  41. @media (max-width: 480px) {
  42. table {
  43. font-size: 10px;
  44. }
  45. th, td {
  46. padding: 8px;
  47. }
  48. th {
  49. font-size: 0.9rem;
  50. }
  51. }