Hi! There's two ways in which you can do this:

<div style="display: grid; margin: 8px; max-width: 650px; height: 750px; margin: 0 auto; overflow: hidden;">
<div style="grid-area: 1 / 1; overflow: hidden; user-select: none;">[[File:Placeholder.png|800px]]</div>
<div style="grid-area: 1 / 1; overflow: auto;">

text here

</div>
</div>
</div>

You might need to change the sizes (which are in the max-width:650px;, height:750px; and 800px in the image- only change the number. don't remove the px or it won't work). If you want to add fonts or anything special, add it to the top part. For example, you'd put:

<div style="display: grid; margin: 8px; border-radius: 13; max-width: 650px; height: 750px; margin: 0 auto; overflow: hidden; font-family: Im Fell English; color: #fff; text-align: center">

At the top for a different font. The color: #fff is the color of the text, and the text-align moves text to the center. I work better with grid-area, but most people work with

<div style="font-family: 'IM fell english', serif; color:#fff; text-shadow: #E4BF8D 0px 0px 5px; text-align: center; padding:10px;">
<div style="position: relative; margin:0 auto; width: 600px; height: 800px; overflow: hidden;">
<div>[[File:Placeholder.png|600px|center|alt=Background Image|link=]]</div>
<div style="position: absolute; top: 0; width: 100%; height: 100%; overflow: auto;">

text here

</div>
</div>
</div>

The thing with image backgrounds is that you have to make them scroll if they get too long, otherwise a too big image will be too zoomed in and too big. you can also copy the code off my Message wall, which has the grid area code.

Thank you so much! Can i have the code for the scroller?

The above code is for the scroller ^^

Adding

overflow: scroll;

Or

overflow: auto;

To any code will make it scroll.

However,

overflow: hidden;

Is to hide anything that goes past the length set for the page. if you don't add a length or width to the page (which is recommended for the boxes around text if you do them), they will expand as a line is taken up.

<div style="overflow-y: scroll; overflow-x: hidden; height:750px; width:620px;">

Determines the exact length and width you want a certain amount to scroll. if you need any help, feel free to reach out!

Thanks!