I´m trying to do a horizontal scrollable thumbnails list, whit non-wrapped non-break content. But the thumbnails always break at the end of the defined div, making the content vertical scrollable.
I use an unordered list with each thumbnail inside it own list element. Defined only the height of the ul, and mark overflow as auto. Also tried to wrap the ul inside a div, but stills fail.
All that's missing is setting the width of the UL to fit all of the list items. Sadly setting it to 100% won't work. Check out this demo.
ul { width: 1500px; /* combined width of all LI's */ height: 200px; margin: 0; padding: 0; } li { float: left; }
Edit: Oh I just realized you probably don't want it to scroll off the page. So just wrap the UL in a div that has whatever dimensions you want, with overflow set as follows (demo #2)
Thanks Mottie. It works like a charm. But still have a problem there.
It works for a specific fixed width declared in the css. The problem is that the thumbnail list is not width fixed. The width grows for each new thumbnail for entry posted. I think going to need some Jquery or something else, because I see that with css only, works wiith fixed width only.
Anyway, thanks again Mottie. That solves me a great way.
True. And it's the partial fault of the "no accompaining info with the usernames". So OP doesnt know me from Adam. But often fellow forum'rs will just skip over links thinking its spam. I do want to help, thats why I posted. I just dont want to rewrite the same code over and over again. Nor am I capable without putting my brain into it. So I post the link
@Eric, it's not showing now, but yesterday when I looked at the time stamps they were exactly the same... 8:32 or something like that. He probably didn't reload the page after posting, so that's likely why he missed it.
I´m trying to do a horizontal scrollable thumbnails list, whit non-wrapped non-break content. But the thumbnails always break at the end of the defined div, making the content vertical scrollable.
I use an unordered list with each thumbnail inside it own list element. Defined only the height of the ul, and mark overflow as auto. Also tried to wrap the ul inside a div, but stills fail.
Someone can help me to achieve this?.
Thanks for your time.
All that's missing is setting the width of the UL to fit all of the list items. Sadly setting it to 100% won't work. Check out this demo.Edit: Oh I just realized you probably don't want it to scroll off the page. So just wrap the UL in a div that has whatever dimensions you want, with overflow set as follows (demo #2)
It works for a specific fixed width declared in the css. The problem is that the thumbnail list is not width fixed. The width grows for each new thumbnail for entry posted. I think going to need some Jquery or something else, because I see that with css only, works wiith fixed width only.
Anyway, thanks again Mottie. That solves me a great way.
With the web you posted here, it´s works fine!!!
Thanks a lot.
They are all the same width? I mean the pictures must be from the beggining the same width?