More actions
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
.card-grid { display: flex; flex-wrap: wrap; gap: 1em; justify-content: space-between; } .card { flex: 1 1 calc(33.333% - 1em); /* 3 columns with spacing */ box-sizing: border-box; } /* Adjust for tablets */ @media (max-width: 768px) { .card { flex: 1 1 calc(50% - 1em); /* 2 columns */ } } /* Adjust for mobile */ @media (max-width: 480px) { .card { flex: 1 1 100%; /* 1 column */ } }