body{
     width:340px;         /* スクリーンにスクロールが不要なサイズ */
     margin:0px;          /* ページ全体のmargin */
     padding:0px;         /* ページ全体のpadding */
     text-align:center;   /* 下記のautoに未対応用のセンタリング */
     background-color: #c0c0c0      
}
/*
margin:0; padding:0;って設定しておくと、とりあえずブラウザの標準で設定されている余白を無くす事ができますね。
ブラウザごとにこの余白の設定はまちまちなもので、わたくしは最初に0にしてます。。（デザインにもよりますが。。）
→　BASIO　不可　？
   キャンバス　width:320  pagebox width:340　  pagebox width:340 height:490
           横と縦のスクロールを回避できた。
*/
#pagebox{
     width:340px;         /* スクリーンにスクロールが不要なサイズ */
     height: 490px;       /* スクリーンにスクロールが不要なサイズ */
     margin-top: 10px;
     margin-left:auto;     /*左側マージンを自動的に空ける */
     margin-right:auto;    /*右側マージンを自動的に空ける */
     text-align:left;     /* 中身を左側表示に戻す */  
     background-color: #ff0000;
}
#canvasbox2{
     width:330px;         /* スクリーンにスクロールが不要なサイズ */
     height: 100px;       /* スクリーンにスクロールが不要なサイズ */
     margin-top: 10px;     /*キャンバスに使用　→　無効　？　　→ pagebox margin-top: 0px;で対処　　*/
     margin-left:auto;     /*左側マージンを自動的に空ける */
     margin-right:auto;    /*右側マージンを自動的に空ける */
}
#canvasbox{
     width:330px;         /* スクリーンにスクロールが不要なサイズ */
     height: 370px;       /* スクリーンにスクロールが不要なサイズ */
     margin-top: 10px;
     margin-left:auto;     /*左側マージンを自動的に空ける */
     margin-right:auto;    /*右側マージンを自動的に空ける */    
}
#page2box{
     width:340px;         /* スクリーンにスクロールが不要なサイズ */
     height: 50px;       /* スクリーンにスクロールが不要なサイズ */
     margin-top: 10px;
	 margin-left:auto;     /*左側マージンを自動的に空ける */
     margin-right:auto;    /*右側マージンを自動的に空ける */
     text-align:left;     /* 中身を左側表示に戻す */ 
     background-color: #00ff00;
}
#filearea{
     width: 330px;         /* スクリーンにスクロールが不要なサイズ */
     height: 50px;       /* スクリーンにスクロールが不要なサイズ */
     margin-top: 10px;
     margin-left:auto;     /*左側マージンを自動的に空ける */
     margin-right:auto;    /*右側マージンを自動的に空ける */	 
     text-align:left;     /* 中身を左側表示に戻す */ 
}