body,html{ height: 100%; } body{ margin: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } .info p{ margin: 1rem; float: left; padding :20px; color:white; } .info img { float: right; padding: 20px; } .container{ display: grid; grid-template-columns:repeat(auto-fit,minmax(35rem,1fr)); height: 800px; } .card-1{ background-color: green; } .card-2{ background-color: orange; } .card-3{ background-color: blue; } .card-4{ background-color: chocolate; } .card-5{ background-color: pink; } .card-6{ background-color: skyblue; } .card-1,.card-2,.card-3,.card-4,.card-6,.card-5{ padding: 20px; }