I want to do this.... |
I want to do this.... |
mrsrjp |
Jun 29 2009, 02:38 PM
Post
#1
|
Group: Members Posts: 7 Joined: 29-June 09 Member No.: 9,021 |
http://www.maverickbusinessadventures.com/
Here is the website. Do you see about half way down they have a list of video testimonials that have their own scroll bar? How can a person replicate that? Thanks! |
pandy |
Jun 29 2009, 03:51 PM
Post
#2
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Put the movies in a DIV. Give it a width, a hight and 'overflow: auto'.
http://www.w3.org/TR/CSS2/visufx.html#propdef-overflow |
mrsrjp |
Jun 29 2009, 06:59 PM
Post
#3
|
Group: Members Posts: 7 Joined: 29-June 09 Member No.: 9,021 |
Put the movies in a DIV. Give it a width, a hight and 'overflow: auto'. http://www.w3.org/TR/CSS2/visufx.html#propdef-overflow Ok dumb question of the week award is about to go to me. How do I do a div? |
pandy |
Jun 29 2009, 11:10 PM
Post
#4
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
|
mrsrjp |
Jun 30 2009, 05:52 AM
Post
#5
|
Group: Members Posts: 7 Joined: 29-June 09 Member No.: 9,021 |
Thank you!!!
|
pandy |
Jun 30 2009, 07:04 AM
Post
#6
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
You're welcome. Post again if it doesn't work out.
Just wanted to add that you don't need to use DIV to create scrollbars. CSS can do it with any block level element. But in this case DIV is the most suitable, HTML-wise. Wanted to explain this, because DIV is often used in examples when CSS tricks are demonstrated and many people get the impression it's the DIV that's magic when it's really utterly unimportant. Could be a P, a H1, whatever. Only that wouldn't be suitable here. |
mrsrjp |
Jun 30 2009, 08:07 AM
Post
#7
|
Group: Members Posts: 7 Joined: 29-June 09 Member No.: 9,021 |
You're welcome. Post again if it doesn't work out. Just wanted to add that you don't need to use DIV to create scrollbars. CSS can do it with any block level element. But in this case DIV is the most suitable, HTML-wise. Wanted to explain this, because DIV is often used in examples when CSS tricks are demonstrated and many people get the impression it's the DIV that's magic when it's really utterly unimportant. Could be a P, a H1, whatever. Only that wouldn't be suitable here. I tried to do it - I don't think I'm doing it right. In box it's auto height and width. In positioning it's auto on height, width, and overflow. Here is the URL: http://www.clientattraction.com/clientattractionwiab/ |
pandy |
Jun 30 2009, 08:47 AM
Post
#8
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
No, auto width and hight won't work. If width and height aren't limited, there won't be anything that can overflow because the box will expand to accommodate its content. You don't have to use px if you don't want to. Other units like em and % will work also, but you must make sure the box is too small to hold what you put in it. Like a bucket filled with water. If the bucket grew larger the more water you poured into it, the water would never run over. Makes sense?
Maybe I should add that "natural" limitations work too. For example if you have a box that runs the full width of the browser window (or is jammed in by other boxes on the sides), you only need to limit its hight explicitly. Point is, the scrollbar appears first when there's nowhere for the content to go. HTML ... <body> <div style="height: 100px; overflow: auto"> #PUT LOTS OF TEXT HERE# </div> </body> </html> |
mrsrjp |
Jun 30 2009, 08:52 AM
Post
#9
|
Group: Members Posts: 7 Joined: 29-June 09 Member No.: 9,021 |
No, auto width and hight won't work. If width and height aren't limited, there won't be anything that can overflow because the box will expand to accommodate its content. You don't have to use px if you don't want to. Other units like em and % will work also, but you must make sure the box is too small to hold what you put in it. Like a bucket filled with water. If the bucket grew larger the more water you poured into it, the water would never run over. Makes sense? You're so stinkin' smart!!! God bless for people like YOU! That worked like a charm. |
pandy |
Jun 30 2009, 08:54 AM
Post
#10
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Oops! You're too quick for me. I added a bit above. Don't want to misguide you.
|
mrsrjp |
Jul 2 2009, 11:59 AM
Post
#11
|
Group: Members Posts: 7 Joined: 29-June 09 Member No.: 9,021 |
Ok so how about this problem. In safari the code looks like *beep*. Everything is fine in IE and FF. Any suggestions?
|
Frederiek |
Jul 2 2009, 01:18 PM
Post
#12
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
Validate your HTML (links on this page) and the CSS too (at http://jigsaw.w3.org/css-validator/).
|
mrsrjp |
Jul 2 2009, 01:51 PM
Post
#13
|
Group: Members Posts: 7 Joined: 29-June 09 Member No.: 9,021 |
thanks! fixed!
|
Frederiek |
Jul 2 2009, 04:08 PM
Post
#14
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
The page now *looks* fixed in Safari, but there are still html and CSS errors.
Let ALA's Flash Satay be your friend. |
Lo-Fi Version | Time is now: 19th April 2024 - 10:49 PM |