What's new
  • 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 I just want little boxes and a stretched background

Karcen

Ten Thousand Club
I am trying to have this set up like image background that doesn't repeat with grey on top then boxes with solid col of back grounds to the right and a character image on the left i can't code even this much has taken hours crawling through here to get can anyone help me? I have tried to look through code from others here but anytime i look it up there is liek a whole novel and i can't even start to tell where code that functions or what is comments.

Code:
[bg=transparent; max-width: 10000px; max-length: 10000px; margin: auto; background: url(https://lagbt.wiwiland.net/images/0/00/Forteresse_airain.jpg); no-repeat]

[bg=transparent; opacity:.9; background: #808080;]


[CENTER][SIZE=3][B][COLOR=rgb(0, 0, 0)]FULL NAME[/COLOR][/B]   here
[B]ALIAS(S)[/B]   here
[B]RACE[/B]   here
[B]AGE[/B]   here
[B]GENDER[/B]   here
[B]SEXUALITY[/B]   here

[B]APPEARANCE[/B]   here

[B]PERSONALITY[/B]   here

01. [SIZE=5][B]BACKGROUND ★[/B][/SIZE][/SIZE]
[SIZE=3][B]CLASS[/B]   here
[B]OCCUPATION[/B]   here

[B]FAMILY[/B]
⯁ here

[B]HISTORY[/B] 
BIO[/SIZE]
[/border]
[SIZE=3]02. [SIZE=5][B]COMBAT ★[/B][/SIZE][/SIZE]
[SIZE=3][B][SIZE=3]SKILLS[/SIZE][/B]
⯁ Top 3 or 4 skills
⯁ here
⯁

[B]WEAPONS[/B]
⯁ here

[B]SPELLS[/B]
⯁ here

[B]POWERS[/B]
⯁ here

03. [SIZE=5][B]MISC ★[/B][/SIZE][/SIZE]
[SIZE=3][SIZE=3][B]FAITH[/B]   here
[B]ART CREDIT[/B]   here

[B]EXTRA INFO[/B][/SIZE][/SIZE]
[/border][/CENTER][/bg][/bg]
 
Last edited:

crucially

𝘆𝗼𝘂’𝗿𝗲 𝗮𝘀 𝘀𝗮𝗻𝗲 𝗮𝘀 𝗶 𝗮𝗺
Helper
Hello!

Can you send the raw code so that it’ll be easier to take a look at?
 

Karcen

Ten Thousand Club
i mean shoudl be easy just hit reply and you will see my code it isn't a massive 10000 word code
 

OrganicUFO

they/them
Hi! I'm not exactly sure what you meant, and I'm still pretty new to code myself, but this is what I came up with. I've attached the raw code first, and then right below that is the same code except I've included my comments so you can see how I did it.

Code:
[border=0px; padding: 5px; width: auto; height: 750px; background: url(https://lagbt.wiwiland.net/images/0/00/Forteresse_airain.jpg); overflow:hidden][border=0px; padding: 0px; width: 100%; height: 98%; overflow-y:scroll; overflow-x:hidden; padding-right:50px]
[row][column=span3]
[img]https://64.media.tumblr.com/56ab487627fae2bf674435566dce8c32/tumblr_pi0vxrkO6R1w54o6bo1_1280.jpg[/img]
[/column][column=span5]
[border=0px; padding: 5px; width: auto; height: 860px; background:#808080; opacity: 0.9; overflow:hidden][border=0px; padding: 0px; width: 100%; height: 98%; overflow-y:scroll; overflow-x:hidden; padding-right:50px; text-align: center;]
[size=3][COLOR=rgb(0, 0, 0)][b]Full Name[/b][/COLOR] Here
[b]ALIAS(S)[/b] here
[b]RACE[/b] here
[b]AGE[/b] here
[b]GENDER[/b] here
[b]SEXUALITY[/b] here


[b]APPEARANCE[/b] here

[b]PERSONALITY[/b] here
[/size]
01. [size=5]BACKGROUND ★[/size]
[size=3][b]CLASS[/b] here
[b]OCCUPATION[/b] here

[b]FAMILY[/b]
here

[b]HISTORY[/b]
Bio
[/size]
02. [size=5]COMBAT[/size]
[b]SKILLS[/b]
[size=3]Top three or four skills
here
⯁

[b]WEAPONS[/b]
Here

[b]SPELLS[/b]
Here

[b]POWERS[/b]
Here
[/size]
01. [size=5]MISC ★[/size]
[size=3][b]FAITH[/b] Here
[b]ART CREDIT[/b] Here

[b]EXTRA INFO[/b]
[/size]
[/border][/border]
[/column][/row]
[/border][/border]

Code:
The purpose of this border is to help contain your image. Using this rather than (bg) allows you to change the size of the background with more ease: [border=0px; padding: 5px; width: auto; height: 750px; background: url(https://lagbt.wiwiland.net/images/0/00/Forteresse_airain.jpg); overflow:hidden]

The purpose of this border (which you don't need) is to provide a scroll-box so that you won't have to worry about squeezing all your content into a certain space. It means you can have any borders be longer than the main background without worrying about it looking wonky. The padding-right:50px just helps make the scrollbar hidden. You can change the padding to different pixel numbers but I personally tend to use 50 as a default as I find it most consistent: [border=0px; padding: 0px; width: 100%; height: 98%; overflow-y:scroll; overflow-x:hidden; padding-right:50px]


Since you wanted images and text beside one another, I introduced columns and rows. You do this by first doing row like so:[row]
Then you make your columns. Column spans can at most add up to 8: [column=span3]
[img]https://64.media.tumblr.com/56ab487627fae2bf674435566dce8c32/tumblr_pi0vxrkO6R1w54o6bo1_1280.jpg[/img]

Since all you wanted here was an image, I closed off the column and began the next one: [/column][column=span5]

Here I basically did what I the same thing as when I created the boarder that goes over your entire BBCode:[border=0px; padding: 5px; width: auto; height: 860px; background:#808080; opacity: 0.9; overflow:hidden]
Here I did once again the same thing so that you can have a scrollbar if all your content doesn't fit into the height of the border. I also put [text-align: center] so that tou won't need to write it into the actual text locations: [border=0px; padding: 0px; width: 100%; height: 98%; overflow-y:scroll; overflow-x:hidden; padding-right:50px; text-align: center;]
[size=3][COLOR=rgb(0, 0, 0)][b]Full Name[/b][/COLOR] Here
[b]ALIAS(S)[/b] here
[b]RACE[/b] here
[b]AGE[/b] here
[b]GENDER[/b] here
[b]SEXUALITY[/b] here


[b]APPEARANCE[/b] here

[b]PERSONALITY[/b] here
[/size]
01. [size=5]BACKGROUND ★[/size]
[size=3][b]CLASS[/b] here
[b]OCCUPATION[/b] here

[b]FAMILY[/b]
here

[b]HISTORY[/b]
Bio
[/size]
02. [size=5]COMBAT[/size]
[b]SKILLS[/b]
[size=3]Top three or four skills
here
⯁

[b]WEAPONS[/b]
Here

[b]SPELLS[/b]
Here

[b]POWERS[/b]
Here
[/size]
01. [size=5]MISC ★[/size]
[size=3][b]FAITH[/b] Here
[b]ART CREDIT[/b] Here

[b]EXTRA INFO[/b]
[/size]

I am now closing off the borders which contain all the text, and since there are two borders I type it out twice: [/border][/border]

I now close the column and row: [/column][/row]

Finally I close the borders containing your entire code: [/border][/border]






Full Name Here
ALIAS(S) here
RACE here
AGE here
GENDER here
SEXUALITY here


APPEARANCE here

PERSONALITY here

01. BACKGROUND ★
CLASS here
OCCUPATION here

FAMILY
here

HISTORY
Bio

02. COMBAT
SKILLS
Top three or four skills
here


WEAPONS
Here

SPELLS
Here

POWERS
Here

01. MISC ★
FAITH Here
ART CREDIT Here

EXTRA INFO


 

Users who are viewing this thread

Top