やっとできました。
もしかしたら私以外にも出来ている人もいるかもしれませんが、
ググり方が悪かったので以下の条件でコーディングがなかなかできませんでした。

・上下左右で中央揃えにする(div要素) → これは結構ググるとでてくる。

問題点: ウィンドウサイズを小さくしたとき、div要素の左と上が消えてしまう。

ということで次の課題は、
・最小幅を最小高さを指定し、上下左右で中央揃えしたdiv要素が消えないようにする。

min-width,min-heightはIE6が対応してくれなくて、
(正確には対応するための解消法はあるが使うと上下左右中央が無効になる為使えない)
いろいろいろいろ考えた。

いろんなサイトを参考にしすぎて、どの参考サイトをもとでに修正をしていったのか忘れたくらいです。
すいません、思い出したら参考サイトを記載させていただきますっっ

CSSは以下のとおり。
-------------------------------------------
html, body {
height: 100%;
}
body{
margin: 0;
padding: 0;
text-align: center;
}
div#catch {
background: #FFF;
width: 100%;
height: 50%;
margin-top: -150px;
margin-left: -400px;
float: left;
}
div#wrap{
width: 400px;
margin: 0 auto;
}

div#container {
width: 400px;
height: 300px;
overflow: hidden;
clear: both;
text-align: left;
position: relative;
}
/* Hide from IE5mac *//*/
div#catch {
display: none;
}
html, body {
height: auto;
}
/* end hack */

HTMLのbody内は以下のとおり。
-------------------------------------------
<div id="catch"></div>
<div id="wrap">
<div id="container">
テキステスト
</div><!--/container-->
</div><!--/wrap-->

サンプルをリンクしたいところですが、すいません、出来ません><

補足を入れると、containerの部分内が上下左右中央揃えされ、ウィンドウをコンテンツ以上小さくしても、
内容は左上寄せとなり、スクロールも出るため消えません。

catchは、必ずwrapより上にいないと上下の中央表示はされません。
<div id="catch">ここにテキストを入れても大丈夫です</div>
↑のとおり。テキストをいれても画面上に表示されませんでした。
巨大スクリーンでみたらもしかしたらでてくるかもしれませんが、
少なくとも横1680px 縦1080pxまでみても大丈夫でした。

確認ブラウザはFirefox3.5、IE6,IE8、safari4.0.5、Google Chrome6.0.なんたら

参考サイト、どなたか見てわかったらコメで教えてくれるとありがたいです!!
本当に参考サイト様たちには感謝しております。m(_ _)m