タグ：「css」の記事一覧
スクロールバーを左に。
- [Permalink] [Post to del.icio.us] [Post to hatena] [Post to livedoorClip]
- デザインをLDRっぽくフレーム風にしました。一応ブラウザサイズによって可変するような感じです。
で左のツリー部分のスクロールバーが左側に表示されてたのを見て、「見やすいよなぁコレ」とか思っていたんですが、やり方とかは特に気にしてませんでした。
てっきりJavascriptで裏技的にやってるのかと思いきや、CSSで簡単にできるんですね。
<div id="side"><div class="container">
～リスト～
</div></div>
最近の流行りだと、こんな感じでサイド部分を作ると思うんですが、普通に「overflow:scroll」させると当然右側にスクロールバーが表示されます。そこで、
#side {
width: 200px;
height: 800px;
overflow: auto;
overflow-y: scroll;
direction: rtl;
}
#side .container {
padding: 5px;
direction: ltr;
}
とすると、スクロールバーは左側になります。実におしゃれ。
「#side」には文章の方向を「RightToLeft(右から左)」にしスクロールバーの表示を逆転させて、コンテナ部分は通常通り「LeftToRight(左から右)」に戻す。頭良いコレ。 - Posted by: simpraight at 2006/11/20 18:58:52 | Tags: [css] [tips] | Comments:2 | Trackbacks:0