Separate scroll bar for categories.

[Elvira]

Hello,

I have searched the forum, but couldn't find the answer anywhere. I would like to have a scroll bar inside the centercolumn for categories with multiple listings. So that the user can scroll down to view the products but the header would always be on top and the sidebar wouldn't move.

Here's the link the page as it is now: http://shopforhealthandbeauty.co.uk/ - So I want the navigation bar on the right hand side between the centercolumn content and the side bar. Is it possible?

Thank you,
Elvira.

[rbarbour]

could try adding this to your stylesheet

div#indexProductList {
height:600px;
overflow:scroll;
}

[Elvira]

It worked! Thank you very much!
Is it possible to get rid of the bottom scroll? Here's how it looks now: http://shopforhealthandbeauty.co.uk/

[rbarbour]

change:
overflow:scroll;


to:
overflow-x:hidden;
overflow-y:scroll;

[dgent]

By doing that you've made your site not work on mobile phones, as scroll bars don't work on a touch screen. Currently on my Android phone you can only see the first three products.

[Elvira]

By doing that you've made your site not work on mobile phones, as scroll bars don't work on a touch screen. Currently on my Android phone you can only see the first three products.

Oh, thank you for letting me know. Hmmm, I have to rethink this then.

[Elvira]

Is there any code that would exclude scroll bar for mobile browsing?
Something like: if PC - use scroll bar, if mobile - don't use scroll bar.

[schoolboy]

Separate stylesheets, perhaps, configured to apply to different devices.

You may also want to look at the VIEWPORT TAG. (Search Google).

[dgent]

Is there any code that would exclude scroll bar for mobile browsing?
Something like: if PC - use scroll bar, if mobile - don't use scroll bar.

Its not worth the risk, as many people run a desktop user agent on their phones so would bring up the scroll bar version.