How to Make a Scrolly Box and Other Things
Jan 22, 2017 13:00:10 GMT -5
xfogpathx, 𝔹ᴏʙᴀ 𝔽ᴇᴛᴛ, and 4 more like this
Post by A crying Nidoking on Jan 22, 2017 13:00:10 GMT -5
I've edited a message I sent to another user about scrolly boxes, and put it here in case other people want to learn how to make them, too!
First things first - you need a div style to make a box. This will be done in the BBCode Tab. A div style looks like this:
After the quotation marks is where you put in the coding that tells your box what to look like. Div syles are closed with [/div], but you will learn about that at the end of this tutorial.
To make a box scrolly you need two small bits of code: "overflow:auto;", and a height. A scrolly box has two height options, and you need one or the other to make it scroll:
1. Max-height.
2. Fixed height.
Fixed height boxes will stay the same size no matter what you put in them. Examples:
Max-height boxes will get smaller if you have not filled them up - they will stretch to a certain point, then they will become scrolly. Examples:
You need one code or the other to make a box scrolly.
You put the code into the div style of the box. Like so:
If you just wanted to learn how to make a box scroll, read no further; you've done it! End your text with [/div] and you should have a brand new scrolly box! If you want to learn how to make your scrolly box fancier, read below.
That scrolly box above doesn't look too fancy, huh? You can add a background to make your scrolly box more eye appealing. This is the code that will give your box a solid-colored background:
Add into your div style, like this. It does not matter what order the code is in, so long as each one is written correctly has a semi-colon after it.
You could go a step further and use this code instead to give your box a background photo (note that this code replaces background-color):
You can also toggle the transparency of your box if you would like to. This is the code for transparency:
On a scale from 0 to 1.0 (like 1-10), 0 is completely transparent and 1.0 is fully solid, not see through at all. .5 is in the middle of that spectrum. When you toggle a box's opacity, you are toggling everything inside it's transparency as well. Text, pictures, and so on.
This is .5 opacity. It is a little bit hard to read.
This is .9 opacity. It is still a little see-through but otherwise easily readable.
If your picture is repeating itself or you would like a smaller box, you can add a width. Your width can be in percentages (like 90%) or in pixels (500 px). They are vastly different in the fact that percentage width is tricky and pixel width is much more accurate. Use this code to add a pixel width:
Or a percentage width:
So now, if you've been following along, your code should look something like this:
After the ending bracket ], type whatever you want your scrolly box to say, and then close it with [/div] when you are done typing. After that, your scrolly box will be editable in the Preview Tab.
Thanks for reading! I hope this messy guide is helpful. Feel free to test codes in the comments below and I'll try to help if you ask!
First things first - you need a div style to make a box. This will be done in the BBCode Tab. A div style looks like this:
[div style="After the quotation marks is where you put in the coding that tells your box what to look like. Div syles are closed with [/div], but you will learn about that at the end of this tutorial.
To make a box scrolly you need two small bits of code: "overflow:auto;", and a height. A scrolly box has two height options, and you need one or the other to make it scroll:
1. Max-height.
overflow:auto;max-height:200px;2. Fixed height.
overflow:auto;height:200px;Fixed height boxes will stay the same size no matter what you put in them. Examples:
✩ This box is scrolly and has a fixed height of 100px. This box is 100px and doesn't have a lot in it. It's not scrolly yet.
✩ This box is scrolly and has a fixed height of 100px. This box is still 100px but has much more stuff in it. TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TETX TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TETX TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TETX TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TETX TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TETX TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TETX TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT
Max-height boxes will get smaller if you have not filled them up - they will stretch to a certain point, then they will become scrolly. Examples:
✩ This box is scrolly and has a max height of 100px. It is smaller because it is not filled yet. Once it hits the 100px mark it will become scrolly.
:}
:}
✩ This box is scrolly and has a max height of 100px. It is smaller because it is not filled yet. Once it hits the 100px mark it will become scrolly.
Like this!
Like this!
You need one code or the other to make a box scrolly.
overflow:auto;max-height:200pxoverflow:auto;height:200px;You put the code into the div style of the box. Like so:
[div style="overflow:auto;max-height:200px;"]Ta-da! Scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrollys crolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly
If you just wanted to learn how to make a box scroll, read no further; you've done it! End your text with [/div] and you should have a brand new scrolly box! If you want to learn how to make your scrolly box fancier, read below.
That scrolly box above doesn't look too fancy, huh? You can add a background to make your scrolly box more eye appealing. This is the code that will give your box a solid-colored background:
background-color:#000000;Add into your div style, like this. It does not matter what order the code is in, so long as each one is written correctly has a semi-colon after it.
[div style="overflow:auto;max-height:150px;background-color:#000000;Ta-da! Scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrollys crolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly
You could go a step further and use this code instead to give your box a background photo (note that this code replaces background-color):
background-image:url(IMG URL HERE);Ta-da! Scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrollys crolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly
You can also toggle the transparency of your box if you would like to. This is the code for transparency:
opacity:.9;On a scale from 0 to 1.0 (like 1-10), 0 is completely transparent and 1.0 is fully solid, not see through at all. .5 is in the middle of that spectrum. When you toggle a box's opacity, you are toggling everything inside it's transparency as well. Text, pictures, and so on.
This is .5 opacity. It is a little bit hard to read.
Ta-da! Scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrollys crolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly
This is .9 opacity. It is still a little see-through but otherwise easily readable.
Ta-da! Scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrollys crolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly
If your picture is repeating itself or you would like a smaller box, you can add a width. Your width can be in percentages (like 90%) or in pixels (500 px). They are vastly different in the fact that percentage width is tricky and pixel width is much more accurate. Use this code to add a pixel width:
width:500px;Or a percentage width:
width:90%;Ta-da! Scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrollys crolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly scrolly
So now, if you've been following along, your code should look something like this:
[div style="overflow:auto;max-height:150px;background-image:url(http://40.media.tumblr.com/ef43a0b22705a6d8811b162aeb28cf7e/tumblr_natlejoOrA1srrmalo1_500.jpg);opacity:.9;width:500px;"After the ending bracket ], type whatever you want your scrolly box to say, and then close it with [/div] when you are done typing. After that, your scrolly box will be editable in the Preview Tab.
Thanks for reading! I hope this messy guide is helpful. Feel free to test codes in the comments below and I'll try to help if you ask!
