divはスクロールボックスの外側で伸縮できますか？

Question

現在のマークアップでは、ダッシュボードのdivに2つのスクロールボックスがあります。選択したタスクの周りに灰色の強調表示をして、情報ボックスの周りの強調表示を強調表示します。それを行う方法はありますか？

http://jsfiddle.net/rEKwb/2/

ありがとう！

編集： これは今のようです。 http://img.photobucket.com/albums/v410/justice4all_quiet/what_it_do.jpg

緑色のボックスの周りの灰色のボックスが切り取られています。別のスクロールボックスにある、その右側の灰色の枠線に合わせて伸ばしてください。

これは私がそれを見せたいものです。あなたはそれはあなたがしようとした場合、水平スクロールバーを作成し、幅を定義し、その親を超え<div id="selected_task">を伸ばすだろうoverflow: scroll;のスタイルであなたの<section id="tasks">を持っているので、 http://img.photobucket.com/albums/v410/justice4all_quiet/example.jpg

Answer 1

は、私は思います。基本的には、overflow: scroll;内の要素をスクロール規則を無視してボックス外にレンダリングすることはできません。拡張されたコンテンツを管理するために常に水平スクロールバーが作成されます。

jQuery scroll bar pluginを使用してposition:relativeとz-indexという値で再生すると、これらのプラグインではdivの組み合わせを使用してブラウザスクロールバーを作成しないようにすることができます。

Answer 2

スクロールバーが使用されていなくても、スクロールバーには常にスペースがあります。 スクロールバーを左に動かすことができれば、右のギャップを取り除くことができます。

あなたは左にスクロールバーを強制するために、テキストの方向を変更してみてください：

direction: rtl;