Monacaで作成したアプリの背景がきれる

Question

Monacaでスマホ向けアプリをつくっているのですが、
端末のデバッカーで確認したところ、スマホを横向きにすると要素が画面下に一部はみ出て、そこをスクロールすると背景がきれて白くなってしまいます
HTMLは以下の感じです

<style type="text/css">
 .backwrapper{
 background-color:black;
 }
</style>
<ons-template>   
<ons-page>
<div class="backwrapper">
 <!--ここにボタンなどを配置-->
</div>
</ons-page>
</ons-template>

検証のためにresize($(document).heigh();)のようなコードでdocumentやbody,<ons-page>のheightを調べたところ、スマホの画面の高さとほぼ同じ数値がでてしまい解決できませんでした。
ご存じのかた回答していただけると幸いです

Answer 1

<style>
.backrapper {
background: #000000;
height: 1080px;
top: 0;
bottom: 0;
margin-top: 0;
margin-bottom: 0;
}

と、ハイトの指定を入れるときれなくなります。その値を大きくして、ovarflow-y: scroll;を指定することも可能です。

Comments

[kontakuto]

初歩的な質問に回答していただきありがとうございました
ご回答をもとに考えてみたんですが、普通はレスポンシブデザインにしてはみ出ないように対応するところでしたよね
いろいろ試してみたいとおもいます

[grandcross_info]

このような回答でよろしければいくらでもお答えします。お役に立てて光栄です。
P.S.
.backwrapper {
padding-bottom: 40%;
}
などもお試しください。