.full{ width: 100%; padding: 100px 0 100px 0; background-color: white; color: black; text-align: center; } .half{ width: 50%; padding: 100px 0 100px 0; text-align: center; float: left; } .third{ width: 33.33%; padding: 100px 0 100px 0; text-align: center; float: left; } .quarter{ width: 25%; padding: 100px 0 100px 0; float: left; } @media screen and (max-width:1200px) { .quarter{ width: 50%; } } @media screen and (max-width:1000px) { .third{ width: 100%; } } @media screen and (max-width:800px) { .quarter{ width: 100%; } .half{ width: 100%; } }