basic mobile layout

topbar, content, bottombar

by revolunet

HTML

<meta name="viewport" content="width=620, user-scalable=no">
        <div class="top">top toolbar</div>
<div class="content">
    content

<!-- start slipsum code -->

Now that there is the Tec-9, a crappy spray gun from South Miami. This gun is advertised as the most popular gun in American crime. Do you believe that shit? It actually says that in the little book that comes with it: the most popular gun in American crime. Like they're actually proud of that shit. 

<!-- please do not remove this line -->
<br><br>
<div style="display:none;">
<a href="http://slipsum.com">lorem ipsum</a></div>
<br><br>
<!-- end slipsum code -->

    <!-- start slipsum code -->

Now that<br><br> there is the Tec-9, a crappy spray gun from South Miami. This gun is advertised as the most popular gun in American crime. Do you believ<br><br>e that shit? It actually says that in the little book that comes with it: the most popular gun in American crime. Like they're actu<br><br>ally proud of that shit. 

<!-- please do not remove this line -->
<br><br>
<div style="display:none;">
<a href="http://slipsum.com">lorem ipsum</a></div>

<!-- end slipsum code -->
<!-- start slipsum code -->

Now that there is the Tec-9, a crappy spray gun from South Miami. This gun is advertised as the most popular gun in American crime. Do you believe that shit? It actua<br><br>lly s<br><br> ays that in the little boo<br><br>k that comes with it: the most popular gun in American crime. Like they're actually proud of that shit. 

<!-- please do not remove this line -->

<div style="display:none;">
<a href="http://slipsum.com">lorem ipsum</a></div>

<!-- end slipsum code -->
<!-- start slipsum code -->

Now that there is the Tec-9, a crappy spray gun from South Miami. This gun is advertised as the most popular gun in American crime. Do <br><br> you believe that shit? It actually says that in the little book that comes wit<br><br> h it: the most popular gun in American crime. Like they're actually proud of that...

CSS

html, body{
    height:100%;
    padding: 0;
    margin: 0;
}
div.top {
    background:black;
    width:100%;
    height:45px;
    position:absolute;
    top:0px;
    color:white;
}
div.content {
    position:absolute;
    width:100%;
    top:45px;
    bottom:45px;
    background:pink;
    overflow:auto;
    -webkit-overflow-scrolling: touch;
}
div.bottom {
    background:black;
    width:100%;
    height:45px;
    position:absolute;
    bottom:0px;
        color:white;
}