Start div scrollbar from bottom with pure css

问题:

Is it possible to start a div's scrollbar from bottom (As initial position, not always) instead from top, with pure css?

回答1:

Use transform:rotateX to wrap div and return it (to avoid the text from turning over) also in sub div

.page{
 overflow-y: scroll;

 width:150px;
 height:150px;
 transform:rotateX(180deg);
                -moz-transform:rotateX(180deg); /* Mozilla */
                -webkit-transform:rotateX(180deg); /* Safari and Chrome */
                -ms-transform:rotateX(180deg); /* IE 9+ */
                -o-transform:rotateX(180deg); /* Opera */
}
.sub{
   transform:rotateX(180deg);
                -moz-transform:rotateX(180deg); /* Mozilla */
                -webkit-transform:rotateX(180deg); /* Safari and Chrome */
                -ms-transform:rotateX(180deg); /* IE 9+ */
                -o-transform:rotateX(180deg); /* Opera */
}

    <div class="page">
    <div class="sub">
       <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p> 
    </div>

    </div>