Having some issues getting this to work. PLEEEEEEASE help.
I would like an element fixed to the top of the viewport, when the user scrolls down the page it remains at the top of the viewport... easy. If the window is narrower then 960px the horizontal scrollbars appear. If the window is scrolled horizontally I would like the content inside this fixed element to scroll with it.
Please check out the demo, the two green boxes should always line up. Make your window narrow and scroll horiz, notice how they no longer line up.
Is this possible without JavaScript? Should work in IE7+ and not totally break in IE6.
Ah, interesting question. I don’t think you can achieve that without JavaScript.
position: fixed means that the element is positioned relative to the viewport. You want that vertically, but you don’t want it horizontally. I don’t think there’s any way to achieve that in CSS.
You can't have position:fixed on an overflow srolling content. You need to use JavaScript for this. i answered a similar question using jQuery at Fixed header inside scrolling block where a div is fixed even if content is scrolling by overflow.
Check working example at http://jsfiddle.net/VswxL/3/
Simple: http://jsbin.com/awaqug/edit#javascript,html,live
Edited a little bit by me, to make it easier to implement as you wish. The jquery code is not mine... Huh. This helped me, in no time...
来源:https://stackoverflow.com/questions/5250573/centering-a-fixed-element-but-scroll-it-horizontally