Grow your CSS skills. Land your dream job.

[Solved] Double Scrollbar problem

  • # December 13, 2009 at 3:21 pm

    I have an in progress wordpress site. I am using the JQuery DatePicker plugin.
    I am using Firefox 3.5.5, Mac.

    For some reason, when I load the page with the date picker plugin I get this weird second vertical scrollbar showing up. As soon as I click the form field that triggers the datepicker the second scrollbar disapears until the page is reloaded.

    If you go to the following link and then click the "Bookings" tab just above the content you will see the form. The fields with the DatePicker loaded are "Check In Date" & "Check Out Date".

    http://www.vander.co.nz/swanlake/swanla … mmodation/

    These are the four stylesheets attached to this page…

    http://cdn.jquerytools.org/1.1.2/jquery.tools.min.js">
    http://www.vander.co.nz/swanlake/js/jqu … .custom.js">
    http://jqueryui.com/latest/ui/ui.core.js">
    http://jqueryui.com/latest/ui/ui.datepicker.js">

    # December 13, 2009 at 4:18 pm

    You have overflow:visible for your content. Set this to hidden and the scroll bar will go away, unfortunately it will also make your datepicker hard to find.

    Set the css for your date picker to be style="position:relative; left:-400px; top:-200px" and that should line it up next to your form.

    # December 13, 2009 at 6:57 pm

    Cheers dude, I actually knew of that side effect as well, just goes to show what a fresh pair of eyes can do.

    Thanks again.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".