cycle-pager div scroll

cycle-pager div scroll

Hi Xperts,

I cannot get the cycle-pager div in a slideshow to respond to the overflow-x:auto; overflow-y:hidden in my CSS.

When the number of images in the pager exceed the width of the div they start a new line of thumbnails instead of disappearing out of the div, activating the x-scroll bar.

Do anyone know how to make that div scroll?

the code in question:

                <div class="cycle-slideshow"
    data-cycle-timeout=0
    data-cycle-caption="#adv-custom-caption"
    data-cycle-caption-template="{{cycleTitle}}"
    data-cycle-center-horz=true
    data-cycle-center-vert=true
                data-cycle-prev="#prev"
                data-cycle-next="#next"
    data-cycle-pager="#pager1"
    data-cycle-pager-template="<a href=# ><img src='{{src}}' class='wb' height=28 border=0></a>"
    data-cycle-slides=">img"
    data-cycle-update-view=-1
                   >
                <br /><br />
                    <%
                    for each f1 in imgs
                    f2ct=f2ct+1
                        title = replace(f1.Name, ".jpg", "")
                        reptitle = replace(Right(title, Len(title) - 3), "-", " ")
                    %>
                    <img src="<%=request("album") & "/" & f1.name%>" height="420px" onMouseOver="//this.style.cursor='zoom-in'" onClick="//zoomimgin('<%=request("album") & "/" & f1.name%>');" data-cycle-title="<%=reptitle%>">
                    <div id="adv-custom-caption" class="center"></div>
                    <%next%>
                </div><br /><br />
<div class="cycle-pager" id="pager1"></div>
    </div>


Best regards
Morten B