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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
Mobile version of website does not react 6 88
Adding Pipe Delimeter  between buttons in css 4 26
CSS Logo Problem. 2 0
Not seen Link button 5 0
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

930 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

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now