horizontal scrollbar for images in html

Question

Hello friends

I am developing a web-site for mobile and i-pod in HTML. I would like a horizontal scroll bar for multiple images in one row, which has a hyper link.

What is easiest method for this?

Thanks in advance for your help.

Answer 1

This example has inline styles, please put all your style rules into a stylesheet when you actually use this code.

Here is an example of the HTML you need...

<div style="width: 500px; height: 120px; overflow: auto;">
    <div style="width: 1000px; height: 120px">
        <ul style="padding: 0;">
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
            <li style="display: inline;"><img src="image.png" alt="My Image"></li>
        </ul>
    </div>
</div>