/** Grid system - https://www.w3schools.com/css/css_rwd_grid.asp **/ * { box-sizing: border-box; } /* For mobile phones: */ [class*="col-"] { width: 100%; } @media only screen and (min-width: 768px) { /* For desktop: */ .col-1 {width: 8.33%;} .col-2 {width: 16.66%;} .col-3 {width: 25%;} .col-4 {width: 33.33%;} .col-5 {width: 41.66%;} .col-6 {width: 50%;} .col-7 {width: 58.33%;} .col-8 {width: 66.66%;} .col-9 {width: 75%;} .col-10 {width: 83.33%;} .col-11 {width: 91.66%;} .col-12 {width: 100%;} } [class*="col-"] { float: left; padding: 15px; border-radius: 20px; /**border: 1px solid red;**/ } .row::after { content: ""; clear: both; display: table; } /** Image - https://www.w3schools.com/css/css_rwd_grid.asp **/ img { max-width: 100%; height: auto; } /** Overflow (for tables) - https://www.w3schools.com/howto/howto_css_table_responsive.asp **/ .overflow { overflow-x:auto; }