Durchlaufbaren Inhalt erstellen, für eine Feste 100% height div

Möchte ich ein scrollbares div. Ich weiß, hier ist viel Beispiel, aber keiner von Ihnen arbeitet für mich.

Habe ich eine .Seite der Klasse, die füllt meinen Handy-Bildschirm. Darin habe ich eine .Inhalt div. Dies ist enthalten den Inhalt der Seiten. Es ist einfach richten Sie den Inhalt von der Spitze, und es sollte, um den Bildlauf durch den Inhalt, wenn es geht, aus dem .Inhalte Grenzen.

.page{
    margin: 0;
    padding: 0;
    min-height: 100%;
    width: 100%;
    display: block;
}
.content{
    padding: 4em 0 0 0;
    overflow-x: hidden;
    overlofw-y: auto;
    /*-webkit-overflow-scrolling: touch;*/    
}

Was sollte ich tun, um es zu arbeiten?

Update

Versuchte ich es in der Geige, und es wird gearbeitet. Aber nicht auf meinem Handy. Weil es ich weiß nicht, wo sollte das problem sein.

Weil es mir angebracht meinen ganzen code der Frage. Dies ist sehr wichtig für mich, um es arbeiten.

Bitte helfen Sie mir. Vielen Dank für jede Hilfe. 🙂

geben Sie Ihre Geige code.
overlofw-y: auto; ?
Bevor ich diese Frage gestellt, ich habe alles versucht, in meiner Hoffnungslosigkeit.
Was für Handy willst du?
Ich sollte mich korrigieren, Handys. Iphone, Samsung galaxy s, und eine Tabelle (m-tech aTab 7)

InformationsquelleAutor Gábor | 2013-05-27

  1. 11

    Ist es das, was Sie brauchen??

    html, body{
    height:100%;
    margin:0;
    padding:0;
}
.page{
    margin: 0;
    padding: 0;
    height: 100%;
    width: 50%;
    display: block; border:solid #000 1px
}
.content{
    padding:0;
    overflow: scroll; overflow-x:hidden;
    height:100%
    /*-webkit-overflow-scrolling: touch;*/    
}
span{
     padding:4em 0 0 0;
    display:inline-block
}

    DEMO

    Verwenden span tag um die Polsterung für die content-div-coz, wenn Sie geben, Polsterung an den Inhalt div berechnet es als zusätzliche Höhe 100%+4em so..

    Und stellen Sie sicher, dass Sie angeben html und body Höhe von 100%, wenn Sie verwenden möchten height:100% in Ihre Seite ein.

    InformationsquelleAutor Sowmya

  2. -1

    Brauchen Sie, um Fenster-Höhe, und müssen es für .page. Trotzdem, müssen Sie einige javascript, dass für. Ich benutzte jQuery für die Lösung. [Sie können andere Bibliothek, seine bis zu Ihnen. Ich schlage vor, Sie diese Lösung]

    Hier ist markup:

    <div class="page">
    <div class="content">

    </div>
</div>

    CSS:

    * { margin:0; padding:0 } /* using * for demo _ you should use proper reset */
html, body { height:100%; height:100% }
body { height:5000px; background-color:#F7F7F7; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:1.6em }
.page { background:#A2A2A2; width:200px; height:600px; overflow-y:scroll; position:fixed }
.content { background-color:#4D4D4D; padding:10px; color:#B7B7B7; }

    JS:

    $('document').ready(function(){
    var wHeight = $(window).height();
    $('.page').css({
        'height' : wHeight + 'px'   
    }); 
});

    Nur sehen diese Geige link - (live-demo) - http://jsfiddle.net/LZT7B/

    InformationsquelleAutor HADI

Schreibe einen Kommentar