.container { border: 2px solid #333; margin: 20px; padding: 10px; }

.item { background-color: #f0f0f0; border: 1px solid #ccc; padding: 20px; text-align: center; }

.flexbox { display: flex; flex-wrap: wrap;}

.item { flex: 1 1 200px;  }

.flexbox { display: flex; flex-wrap: wrap;}

.item { flex: 1 1 200px;}

@media (max-width: 600px) {
    .flexbox { flex-direction: column; }
}
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));  gap: 10px; }

@media (max-width: 600px) { .grid { grid-template-columns: 1fr; } }