Horizontal scrollbar width

I'd like to have a fixed width for a horizontal scrollbar (read: track), that is narrower than the actual width of the content it is scrolling (center aligned). I'm looking to achieve this with the webkit scrollbar module.

I know this is pushing the boundaries of a scrollbar but it would be nice to achieve from a design perspective.

My attempt to so far: http://jsbin.com/ohusu3/5

I have tried applying a minus left and right margin to the #content div to pull it out of the scroller, but the overflow is hidden obviously with the scroll property. I think it might开发者_开发问答 be possible with a few more container divs, somehow.

I'm avoiding any jQuery plugin solutions for now.

This is impossible in CSS, you're going to have to seek out a javascript solution for this.