CSS horizonal scroll box, currently a vertical one

Posted on 2014-03-23
Last Modified: 2014-03-23

I have a client asking me to make their current vertical scroll box under the main image into a horizontal one.

The image number varies, is there a graceful way to do this?
Question by:movieprodw
  • 2
  • 2
LVL 58

Expert Comment

ID: 39948958
No graceful way.
You would have to calculate the total width of the images (UL/LI) and then set the width of the UL to this.

Author Comment

ID: 39948965
Hello Gary,

That is fine, I can count the images and set the width, can you please help me with the code, lets say that it si 400px wide and I want it to display 200px wide and have a scroll bar for the rest.

LVL 58

Accepted Solution

Gary earned 500 total points
ID: 39948969
Increase the height in .more-views {} - about 130px
Set the width of the ul with inline css

And that's it

Author Closing Comment

ID: 39949130

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Sort Order Icons on HTML Table 3 57
Mouse event to control image and transparency. 4 43
alert on input text 2 23
CSS Style on Chrome 1 32
Creating a CSS block that only applies to printing By default, all of your CSS applies to every possible view of your page - whether on screen, printed, landscape, touch-screen, or whatever.  You can, however, add CSS that only applies under certai…
This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question