HTML Tricks: Scroll Box
Here's how to add a scroll box to your website, blog, or whatever! Simply take this code:
<div style="border: 1px solid #aaa;background-colo r:#f9efef; width:350px; height:250px; overflow:auto; color:#FFF;"><p>
</p>
</div>
Place whatever you want in between the <p> and </p>. Adjust size, border, background, and text color as needed.

56 Comments:
I was just browsing various blogs as I was doing a search on the word poster, and I just wanted to say that I really like what you've done with your blog, even though it wasn't particularly related to what I searched for. I appreciate your postings, and your blog is a good example of how a blog should be done. I've only just recently started a Posters website - feel free to visit it when you get a chance if you wish. Much success, antonio.
GREAT html! thank you! :D
hmmm, this doesn't seem to work for me. I get the box, but no scroll bar
it's not working for me AT ALL.
none of the box shows up.......????
fantastic..solved all my probelems
thank you very much
Solved my problems like *tries to snap but fails pitifully* aw man *claps* that
It worked perfectly for me....it's awesome, thanks heaps.
Sally Green
Chic Alert
Where have you been all my life?!?
Just what I badly needed!
Thanks a lot!
to anonymous - you need to have a lot of items listed to get a scroll bar, if not, it will just be a box.
Try adjusting the height and insert your stuff between p and /p
Is there a trick to get items to go to a new line cause enter doesn't work and I dont wanna put "<" br ">" (without the quotes) before my list (423 items) thanks so much!
Sorted - Thankyou very much. I was going to ask How to make this work in Wordpress sidebar please? But I managed my first scroller on WP...wheeee!
K
This screwed up my page...
How come it screwed anon?
Mine works like a dream with images
http://katesdreamweavercentre.com/katesplace/
Whats your problem? Maybe we can help!
THANK YOU! thank you thank you thank you thank you!! ive been looking for this all day and i havent been able to figure it out til now! THANK YOU!
Thank you ! I finally have a scroll box :]
Thanks, I really thought this html was really easy, and it works. See how I used the scroll box on christinacastle.com
Thanks,
Salena
thank you
now how do you disable the html code you put in the box
awesome i love it it may seem it doesnt work at first but then again it does once u fix the with and the length
Wow works!!
TO those who dont know how to do it.. Add alot of pics..
WOA THANXS SOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO MUCH!!
XD
Thanks dude! it deffinately works for me :)
This post has been removed by the author.
i'm trying to put html inside the scroll box.
can you help?
it isnt working.. i just get the box..=/
but here's a question for you how do i change the color of the scrollbar's track and face color?
Hey, How did you get the html to show up in there by itself ... e-mail me at krayzy77@gmail.com
If It doesnt work for you, meaning you get the box but no scroll bar write more text and the more you write it will start to scroll.
can yu put pics in this scroll box?
Very, very helpful.
Thank you.
(:
Thanks...I spent a while trying to figure this out on my own and your tip worked like a charm! Cheers!
thnx man ..Cool n i Guess The Best Trick
this is so helpful!!!!
it does work but how do you disable the HTML in the box so it only shows text?
thnx man been looking all over 4 this
ThankS! Very helpful indeed :)
THANKS DAT REALLY HELPED
thanks more than you know.....I love the open attitude you and others have of sharing what you know....
how do u put a HTML code in,
without it making the picture or anything?
I finally found what I need...thanks!
how do you disable the html in the box?
email me plz at diamond_dice250@hotmail.com
Thanks a lot for sharing this trick. I've been searching for this trick in google all night and everything I found didn't work on my blog. Thanks to you now my blogroll looks more organized and my sidebar looks neater. Kudos!
Yay.
Thankyou.
It works well :]
Bear HUGGGS to you. Your's worked! I tried suggestions from several others but they did not succeed. So you can imagine how happy I am after using your code.
Cheers!
No scrollbox code ever works for myspace. I've tried adjusting the height and width but nothing seems to work. When I preview/save changes it comes out as blank. I know I have enough text but it doesn't work anyway.
Thank You! That was easy!
awesome job man! exactly what i needed!
I love this! Thank you SO much for sharing it with us all.
thank you. this really helped my site www.haxorz.net add a "recent updates" table
thanks so much for this scroll box I love the fact that you can change the border to be dashed or dotted or just get rid of it. gives this scroll nice versatility.
Thanks for the code, and it's really easy to work with. But I'm trying to use it on my freewebs and I can't seem to get two on the same line. Can you or anyone help?
Excellent help thanks. The reason you guys are having trouble is because you have to change the hex colors. Your font is white, just like your background color. Also no scroll bar appears because you dont have enough text to make it scroll yet.
Thank you.
I used it here
http://icanhasfunny.blogspot.com/2008/10/advertise-us.html
Heyy thanks...
It actually w0rks really well...
idk whats wrong wit da ones dhat says it dont work..but it works juss fine!!
thanks alot!!!!
muchh luv ♥
TY!!!!
thanks for the tip. i used this in my blog: http://bloggistame.blogspot.com to shorten my long lists....
regards and happy blogging!
hi Im new in this blog thing and I want to know hot to put a scroll box but with images photos , I mean is the same code I just have to put the img src code? please answer ^^
thanks ! That work out very well :)
Thanks for that!
Post a Comment
<< Home