Learn the CSS @media rule and the easiest way to make a responsive and mobile-friendly website layout. <style> body{margin:0px;} #box1{ margin: 0px auto; width:1000px; height:400px; background: pink; padding:20px; } @media screen and (max-width: 768px) { #box1{ margin: 0px auto; width:98%; height:400px; background: #B3D9FF; padding:1%; } #box1 h2{ font-size:0.9em; } #box1 p{ font-size:0.7em; } } </style> <div id="box1"> <h2>My web site</h2> <p>Blah blah blah...</p> </div>