スマホ用のWebサイトをPCで表示する場合は、一般的にCSSの@mediaで振り分けするのが一般的だが、max-widthの設定でもPCで表示が崩れにくいらしい。(スマホが無いのでよくわからん?)
こんな感じで使う。
すると600px以上に広がらなくなる。
<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>タイトル</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<style>
*{
margin:0;
padding:0;
color:#00f;
}
.wrap{
max-width:600px;
margin:auto;
}
.head{background-color:#3d3;}
.main{background-color:#dfd;}
.foot{background-color:#eee;}
.p_head{font-size:32px;}
/* 画像などはwidth:100%とする事 */
</style>
</head>
<html>
<body>
<div class="wrap">
<div class="head">
<p class="p_head">タイトル</p>
</div>
<div class="main">
<h1>H1H1H1H1H1H1H1H1</h1>
<p>メイン、メイン、メイン、メイン、メイン、メイン、メイン、メイン、</p>
<h2>H2H2H2H2H2H2</h2>
<p>メイン、メイン、メイン、メイン、メイン、メイン、メイン、メイン、</p>
<h2>H2H2H2H2H2H2</h2>
<p>メイン、メイン、メイン、メイン、メイン、メイン、メイン、メイン、</p>
<p>メイン、メイン、メイン、メイン、メイン、メイン、メイン、メイン、</p>
</div>
<div class="foot">
<p>(c) 2016 あちあち情報局</p>
</div>
</div>
</body>
</html>