.gallery-grid { display: grid; /* Auto-fit creates as many columns as possible, filling available space */ /* Minmax ensures columns are at least 250px wide, but grow up to 1fr */ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; padding: 20px; max-width: 1200px; /* Optional: constrain width */ margin: 0 auto; /* Optional: center the grid */ } .gallery-item { background-color: #f9f9f9; border: 1px solid #ddd; padding: 15px; text-align: center; box-shadow: 0 2px 5px rgba(0,0,0,0.1); display: flex; /* For content alignment within the item */ flex-direction: column; justify-content: space-between; } .gallery-item img { max-width: 100%; height: auto; margin-bottom: 10px; }