• When posting, please be aware that artistic nudity is still nudity and not allowed under RpNation rules. Please edit your pictures accordingly!

    Remember to credit artists when using work not your own.

Help Help! New to bbcode and am wondering how to make invisible scrolls

MegMath13

We're All Mad Here!
Code:
[Centerblock=60]
[div=background:url('https://www.solidbackgrounds.com/images/1280x1024/1280x1024-dark-pastel-blue-solid-color-background.jpg');background-size:cover;border:5px #1976d2 double;color: #000000;padding:5px;]
[color=white][h] Trapped: A Disney Roleplay[/h]
[CENTER][size=5][font=Indie Flower]"Say goodbye to your happily ever afters!" -Maleficent[/font][/size][/CENTER][/color]
[div=background:url('https://i.pinimg.com/originals/9b/94/78/9b9478c85c88387859f23529f111955c.jpg ');background-size:cover;]
[scroll=200px]
text








text









text
[/scroll]
[/div]
[/div]
[/Centerblock]

Screenshot_20190222-220244.png

I just don't care for the way the lines look?
 
here you go ! you'd use this code for hidden scrolls;
in the first div where you see "height: 426px" the number is where you'd change your height, everything will be kept the same !

Code:
[div=width: calc(100% - 0%); height: 426px; overflow: hidden; padding: 0px;][div=width: 100%; padding-right: 150px; height: 100%;overflow-y: scroll;] text here[/div][/div]

edit: so where you have the "scroll" tag in your code, replace it with the two divs ! < 3
 
here you go ! you'd use this code for hidden scrolls;
in the first div where you see "height: 426px" the number is where you'd change your height, everything will be kept the same !

Code:
[div=width: calc(100% - 0%); height: 426px; overflow: hidden; padding: 0px;][div=width: 100%; padding-right: 150px; height: 100%;overflow-y: scroll;] text here[/div][/div]

edit: so where you have the "scroll" tag in your code, replace it with the two divs ! < 3
Thank you so much!!
 
since you used a pink background image, you can specific write in a "width" to change the size of that pink bg!
 
hmmmm,
how much smaller would you like the box to be?
i can work it for you if you'd like ?
when working with divs, the order doesn't matter too much, actually !
however, with reg. bbcode, it's quite wonky in terms of it being in exact placements and all !

and it's not a problem at all !
 
Just where it isn't right at the edge of the outer Div. I want to be able to make them look appealing.

That would be great. I took a coding class but I've forgotten how it goes.
 
so you can do it this way with making the "padding: 20px" in the first div you have with the blue background image for more space from the borders:



Trapped: A Disney Roleplay
"Say goodbye to your happily ever afters!" -Maleficent

text here



Code:
[Centerblock=60]
[div=background:url('https://www.solidbackgrounds.com/images/1280x1024/1280x1024-dark-pastel-blue-solid-color-background.jpg');background-size:cover;border:5px #1976d2 double;color: #000000; padding: 20px;]
[color=white][h] Trapped: A Disney Roleplay[/h]
[CENTER][size=5][font=Indie Flower]"Say goodbye to your happily ever afters!" -Maleficent[/font][/size][/CENTER][/color]
[div=background:url('https://i.pinimg.com/originals/9b/94/78/9b9478c85c88387859f23529f111955c.jpg ');background-size:cover; padding: 5px;]
[div=width: calc(100% - 0%); height: 200px; overflow: hidden; padding: 0px;][div=width: 100%; padding-right: 150px; height: 100%;overflow-y: scroll;] text here[/div][/div]
[/div][/div][/Centerblock]

or you can do it to where you give the div with pink background image a specific width [ the width tag can go at the end of the div , middle, etc. ] , i also added "margin: auto;" which makes the pink box itself centered !



Trapped: A Disney Roleplay
"Say goodbye to your happily ever afters!" -Maleficent

text here





Code:
[Centerblock=60]
[div=background:url('https://www.solidbackgrounds.com/images/1280x1024/1280x1024-dark-pastel-blue-solid-color-background.jpg');background-size:cover;border:5px #1976d2 double;color: #000000; padding: 5px;]
[color=white][h] Trapped: A Disney Roleplay[/h]
[CENTER][size=5][font=Indie Flower]"Say goodbye to your happily ever afters!" -Maleficent[/font][/size][/CENTER][/color]
[div=background:url('https://i.pinimg.com/originals/9b/94/78/9b9478c85c88387859f23529f111955c.jpg ');background-size:cover; width: 95%; margin: auto; padding: 5px;]
[div=width: calc(100% - 0%); height: 200px; overflow: hidden; padding: 0px;][div=width: 100%; padding-right: 150px; height: 100%;overflow-y: scroll;] text here[/div][/div]
[/div]
[/div]
[/Centerblock]
 

Users who are viewing this thread

Back
Top