css Top Buttom

by Hilarius Doren

HTML

<h1>Here is the Normal one</h1>
<div class="Container">
    <div class="Content">I'm in Content and I'm very long</div>
</div>

<h1>And here is the Flipped one</h1>
<div class="Container Flipped">
    <div class="Content">I'm in Content and I'm very long</div>
</div>

CSS

.Container
{
    width: 200px;
    overflow-y: auto;
}
.Content
{
    width: 300px;
}

.Flipped, .Flipped .Content
{
    transform:rotateX(180deg);
    -ms-transform:rotateX(180deg); /* IE 9 */
    -webkit-transform:rotateX(180deg); /* Safari and Chrome */
}