BBCode Help

Status
Not open for further replies.
No problem :) Best of luck!
 
i used bbcode in chat and somebody elses colour got changed, i didn't even use colour changing bbcode
 
i used bbcode in chat and somebody elses colour got changed, i didn't even use colour changing bbcode

This is more a thread for helping folks figure out how to code :) If you're having an issue you can post a thread in the Help Desk and someone should be able to hopefully get it sorted!
 
This is more a thread for helping folks figure out how to code :) If you're having an issue you can post a thread in the Help Desk and someone should be able to hopefully get it sorted!
ah okay, i think we have it sorted anyway :3
 
  • Like
Reactions: Elle Joyner
Hello everyone, I'm here to be a nuisance again. lol

Okay, I would like to set-up a new role-play and I was thinking about making the Sign-up thread with the story premise, character races, classes, etc--to be a tab system so it's all right there. I was thinking of using this (Tab) for the background of each tab, make it look like pages from a book. Each tab would have a 300x300 image left of center (Imga=left basically), with the main page that has the story premise, to have a slightly larger image centered at the top with the information below.

I was wondering, how I might go about doing that. In the past, whenever I tried to make a tab system it always got screwy with me. Finnicky bastards. lol

I also was wondering, if Iwaku supported any other fonts than what is listed in the Font Family because the first page here has 'Google Fonts'.
 
I was just wondering how to make an image into a circle? Or, uh... I noticed that some folks have images put into circles (like this). That seems to be done with div coding. While trying to implement it into a different template, I wasn't really able to get it to work the way I wanted to... is it possible to just give an image a rounded border using the
[ img] tag? Or do I have to bugger around with divs? Basically I just wanted a single image centered in a div table with a rounded border...
 
I was just wondering how to make an image into a circle? Or, uh... I noticed that some folks have images put into circles (like this). That seems to be done with div coding. While trying to implement it into a different template, I wasn't really able to get it to work the way I wanted to... is it possible to just give an image a rounded border using the
[ img] tag? Or do I have to bugger around with divs? Basically I just wanted a single image centered in a div table with a rounded border...
As far as I'm aware you have to use divs!

Edit: Here's a quick link to a base code of sorts for circle images.
 
You could edit the image into a circle via photoshop? That's the only thing I can suggest other than divs :)
 
Hello folks! I can't quite remember how to do this, so what is the best way to format the scroll bar on a div box? Since the original one is so block-y. -3- Thanks.
 
Hello folks! I can't quite remember how to do this, so what is the best way to format the scroll bar on a div box? Since the original one is so block-y. -3- Thanks.
Hey Absyinthe! What exactly do you mean by format?
 
  • Love
Reactions: Absyinthe_Artica
I want to change the way the scroll bar looks, that's what I mean by format. ^.^ Instead of the default scroll bar, I was wondering if there is coding to change how it looks?
 
I want to change the way the scroll bar looks, that's what I mean by format. ^.^ Instead of the default scroll bar, I was wondering if there is coding to change how it looks?
Hmm, it's possible to "hide" them by layering another div "on top" of it, but I don't think you can actually manipulate the way divs display the scrollbars.
 
I just saw Nemopedia's Test Chambers and was looking at the last div box on their page. It has a slimmer scroll bar that looks better than the default one. I just would like to know how to make the scrollbar like they did, since it isn't as bulky and large like the default scroll bar. ^.^
 
Ah, it looks like @Nemopedia is "cutting" off part of the scrollbar with another div. I'm not sure how she's doing it, so Ima summon her here :O
 
  • Love
Reactions: Absyinthe_Artica
I just saw Nemopedia's Test Chambers and was looking at the last div box on their page. It has a slimmer scroll bar that looks better than the default one. I just would like to know how to make the scrollbar like they did, since it isn't as bulky and large like the default scroll bar. ^.^

lel such coincidence for me to open up this page just after coding.

It is not really a slimmer scrollbar, just me hiding the scrollbar behind another box. The codes I used for the scrollbar in that particular code isn't really mobile friendly, as phones tend to remove the scrollbar and jump the text a little, so hiding them behind the boxes. However, if you want the cheat for that, what I did was create a box with a set width, add in an overflow: hidden element to it and then set another box within the box with the same width and add in an overflow-y: scroll element. That does the trick.

If you want it mobile friendly, however, then you will have to play around with flex boxes using the same method I explained earlier.

But to share the particular code I used in its most basic form:

Code:
[div= margin: auto; 
width: ##px; 
height: ##px; 
overflow:hidden;] 
[div=width: ##px; 
height: ##px; 
overflow-y: scroll;  
padding: #px; ]  [/div][/div]
 
Thank you! So I am not entirely sure where I would place these codes in my already existing code:
Code:
[div=background: #30382B url(http://i.imgur.com/02E4lfw.png) repeat center fixed;
 border: 15px solid transparent;
 padding: 15px;
 -webkit-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
 -o-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
 border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
 width: 85%;
 height: 1372px;
 overflow: scroll;
 overflow-x: hidden;
 margin: auto;
 box-shadow:  -2px -2px 30px 5px #170400;]
[center][img]https://i.imgur.com/6nwhjCk.png[/img][/center]

 [div=background-color: #30382B;
 border-top: 5px ridge #F5924F;
 border-bottom: 5px ridge #98442A;
 border-left: 10px double #592C26;
 border-right: 10px double #592C26;
 padding: 15px;
 margin: auto;
 width: 85%;
 height: auto;
 color: #B5BB8B;
 font-size: 14pt;
 font-family: Trebuchet MS;
 box-shadow:  -2px -2px 20px 10px #170400;]
[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

 [div=
background-color: #592C26;
border: 2px ridge #F5924F;
border-radius: 30%;
padding: 9px;
color: #B5BB8B;
font-size: 20pt;
font-family: Trebuchet MS;
font-variant: small-caps;
text-align: center;
text-decoration: underline;
width: 80%;
margin: auto;
text-shadow: 2px 2px 3px #30382B;
font-weight: 800;
letter-spacing: 2px;
box-shadow:  -2px -2px 10px 8px #1B2415;]In a Realm of Seasons...[/div]

[IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA]Amidst a vast and endless ocean, there lies an archipelago that is surrounded by a magical force field. This archipelago is made up of five different islands. The force field forms a five mile perimeter around the outer edges of each island. The barrier around the Seasonal Island Kingdoms allows anyone to come inside; however, once they have passed through the force field they are bound within it forever. Every island is affected by various magical energies. The main energy within the force field is called [b][i]Kausi[/b][/i] [size=1](Caw-sea)[/size]. This energy warps the climate and seasons of each island.

[IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA][color=#8DE87D][b]Sprinfata[/b][/color] is the first island in the archipelago. Kausi warps this isle's season into being spring always. [color=#FFFA77][b]Sumenoto[/b][/color] is the next island to the southeast of Sprinfata. Kausi warps that island into being perpetually in a summer season. [color=#CE6240][b]Autunmei[/b][/color] is the island to the north of Sumenoto.  Kausi warps this isle's season into being in an endless fall cycle. [color=#D1EEFF][b]Winturof[/b][/color] is the island that is in the most southern location to all islands. Kausi bends this isle's season into being in an eternal winter. Finally, [color=#E5E5CE][b]Nuetolam[/b][/color] is the last island in the archipelago, this island is located to the far east of all islands. Kausi warps this island into having a normal cycle of all four seasons throughout the year, instead of just one, like the others. This makes each island have an unique atmosphere and culture.

[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]
[center][size=1]scroll down for more information[/size][/center]
[/div]








 [div=background-color: #30382B;
 border-top: 5px ridge #F5924F;
 border-bottom: 5px ridge #98442A;
 border-left: 10px double #592C26;
 border-right: 10px double #592C26;
 padding: 15px;
 margin: auto;
 width: 85%;
 height: auto;
 color: #B5BB8B;
 font-size: 14pt;
 font-family: Trebuchet MS;
 box-shadow:  -2px -2px 20px 10px #170400;]
 [hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

 [div=
background-color: #592C26;
border: 2px ridge #F5924F;
border-radius: 30%;
padding: 9px;
color: #B5BB8B;
font-size: 20pt;
font-family: Trebuchet MS;
font-variant: small-caps;
text-align: center;
text-decoration: underline;
width: 80%;
margin: auto;
text-shadow: 2px 2px 3px #30382B;
font-weight: 800;
letter-spacing: 2px;
box-shadow:  -2px -2px 10px 8px #1B2415;]Class Energies[/div]

 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA]There are seven other energies that flow throughout Seasonal Island Kingdoms. These energies are the vital essence of each known class. This essence is the base power for many roleplay perks in the game. More information about each energy is listed below:

[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

 [SPOILER=Verndari][bg=#6E0808]
 [div=
background-color: #420000;
border: 2px solid #890000;
border-radius: 30%;
padding: 9px;
color: #E5DCA0;
font-size: 20pt;
font-family: Trebuchet MS;
font-variant: small-caps;
text-align: center;
text-decoration: underline;
width: 80%;
margin: auto;
text-shadow: 2px 2px 3px #2B272B;
font-weight: 800;
letter-spacing: 2px;
box-shadow:  -2px -2px 35px 8px #C6AE31;]The Warrior's Vigor[/div]

[imga=left]https://i.imgur.com/nhJiyY1.png[/imga] [size=5]The [i]Verndari Energy[/i] is the vital essence of the [b]Protector’s Class[/b]. [/size]

[imga=left]https://i.imgur.com/nhJiyY1.png[/imga] [size=5]This energy gives strength to those who wield it. [/size]

[imga=left]https://i.imgur.com/nhJiyY1.png[/imga] [size=5]Characters with the [i]Viribus Aura[/i] can completely utilize this energy without any training needed.[/size]

 [/bg]
 [/SPOILER]

 [SPOILER=Lenire]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA][b]Lenire[/b]   [size=1](Len-ear)[/size] - Soother's Essence
 [/SPOILER]

 [SPOILER=Swyno]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA][b]Swyno[/b]   [size=1](Swhy-no)[/size] - Enchanter's Essence
 [/SPOILER]

 [SPOILER=Gewas]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA][b]Gewas[/b]   [size=1](Geh-wahs)[/size] - Planter's Essence
 [/SPOILER]

 [SPOILER=Pemburu]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA][b]Pemburu[/b]   [size=1](Pem-burr-ooh)[/size] - Hunter's Essence
 [/SPOILER]

  [SPOILER=Atīndriya]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA][b]Atīndriya[/b]   [size=1](At-een-dree-yah)[/size] - Philosopher's Essence
 [/SPOILER]

 [SPOILER=Tónlist]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA][b]Tónlist[/b]   [size=1](Tyon-list)[/size] - Charmer's Essence
 [/SPOILER]

 [hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]
 [/div]





 [div=background-color: #30382B;
 border-top: 5px ridge #F5924F;
 border-bottom: 5px ridge #98442A;
 border-left: 10px double #592C26;
 border-right: 10px double #592C26;
 padding: 15px;
 margin: auto;
 width: 85%;
 height: auto;
 color: #B5BB8B;
 font-size: 14pt;
 font-family: Trebuchet MS;
 box-shadow:  -2px -2px 20px 10px #170400;]
 [hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

  [div=
background-color: #592C26;
border: 2px ridge #F5924F;
border-radius: 30%;
padding: 9px;
color: #B5BB8B;
font-size: 20pt;
font-family: Trebuchet MS;
font-variant: small-caps;
text-align: center;
text-decoration: underline;
width: 80%;
margin: auto;
text-shadow: 2px 2px 3px #30382B;
font-weight: 800;
letter-spacing: 2px;
box-shadow:  -2px -2px 10px 8px #1B2415;]A World Awaits You...[/div]

 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA]For now the islands are at peace with one another, but turmoil is brewing underneath the surface. In a fantastical realm of seasons, where will you reside? Seasonal Island Kingdoms aims to be a choose your own adventure styled group roleplay.  This means that the world is an open-ended place where many outcomes can happen in the IC. There is unlimited character spots open as this is a growing world. There will be several roleplay perks in this roleplay to spice up the gameplay. If you want to know more about each island, there is a guide for each of them as well.  These perks will be explained in more detail, down below.

[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

[/div]







 [div=background-color: #30382B;
 border-top: 5px ridge #F5924F;
 border-bottom: 5px ridge #98442A;
 border-left: 10px double #592C26;
 border-right: 10px double #592C26;
 padding: 15px;
 margin: auto;
 width: 85%;
 height: auto;
 color: #B5BB8B;
 font-size: 14pt;
 font-family: Trebuchet MS;
 box-shadow:  -2px -2px 30px 5px #170400;]
[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

 [div=
background-color: #592C26;
border: 2px ridge #F5924F;
border-radius: 30%;
padding: 9px;
color: #B5BB8B;
font-size: 20pt;
font-family: Trebuchet MS;
font-variant: small-caps;
text-align: center;
width: 80%;
margin: auto;
text-decoration: underline;
text-shadow: 2px 2px 3px #30382B;
font-weight: 800;
letter-spacing: 2px;
box-shadow:  -2px -2px 10px 8px #1B2415;]Island Guide Directory[/div]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA]There is a guide for each island. The directory for each guide is down below. Those threads will house the links to all four parts of the island guide. May these guides help any player who wishes to take part in this roleplay!

 [hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

 [CENTER](Sprinfata Island Overview Guide Link Goes Here)

 (Sumenoto Island Overview Guide Link Goes Here)

 (Autunmei Island Overview Guide Link Goes Here)

 (Winturof Island Overview Guide Link Goes Here)

 (Nuetolam Island Overview Guide Link Goes Here)[/CENTER]

[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]
 
[/div]






 [div=background-color: #30382B;
 border-top: 5px ridge #F5924F;
 border-bottom: 5px ridge #98442A;
 border-left: 10px double #592C26;
 border-right: 10px double #592C26;
 padding: 15px;
 margin: auto;
 width: 85%;
 height: auto;
 color: #B5BB8B;
 font-size: 14pt;
 font-family: Trebuchet MS;
 box-shadow:  -2px -2px 30px 5px #170400;]
[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

 [div=
background-color: #592C26;
border: 2px ridge #F5924F;
border-radius: 30%;
padding: 9px;
color: #B5BB8B;
font-size: 20pt;
 font-family: Trebuchet MS;
font-variant: small-caps;
text-align: center;
text-decoration: underline;
width: 80%;
margin: auto;
text-shadow: 2px 2px 3px #30382B;
font-weight: 800;
letter-spacing: 2px;
box-shadow:  -2px -2px 10px 8px #1B2415;]Roleplay Perks[/div]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA]Roleplay perks are different game mechanics that I have added to this roleplay to 'spice' it up! In Seasonal Island Kingdoms, there is ten different roleplay perks active in the game. Each tab will explain more about the various perks. If you have any questions, be sure to let me know.

[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]
 [accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Experience and Leveling System[/BG][/div]|center}[div=background-color: #1A2812; margin: auto; padding: 15px; border: 5px dotted #98442A;]

 [tabs]
[tab=Experience Gain][bg=#30382B]
Experience is gained by....
[/bg]
[/tab]

[tab=Leveling Requirement][bg=#30382B]
The requirements to gain a level is....
[/bg]
[/tab]  

[tab=Leveling Rewards][bg=#30382B]
The rewards for leveling up are....
[/bg]
[/tab]  
[/tabs]

[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Hidden Object Game System[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]World Recipe Book[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Character Classes[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Class Ability Points[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Energy Talent Points[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Character Occupations[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Professional Skills[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Trading and Inventory Items[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[accordion=bcenter|100%]{slide=[div=background:url(http://i.imgur.com/02E4lfw.png); color: #B5BB8B; margin: -7; padding: 25px; border-radius: 100px; font-size: 20pt; text-shadow: 1px 1px 1px #1B2415;][bg=#98442A]Quests[/BG][/div]|center}[div=margin: -6px;][bg=#161F10]
Explanation about perk goes here

[/bg]
[/div]{/slide}[/accordion]
[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

[/div]




 [div=background-color: #30382B;
 border-top: 5px ridge #F5924F;
 border-bottom: 5px ridge #98442A;
 border-left: 10px double #592C26;
 border-right: 10px double #592C26;
 padding: 15px;
 margin: auto;
 width: 85%;
 height: auto;
 color: #B5BB8B;
 font-size: 14pt;
 font-family: Trebuchet MS;
 box-shadow:  -2px -2px 30px 5px #170400;]
[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]

 [div=
background-color: #592C26;
border: 2px ridge #F5924F;
border-radius: 30%;
padding: 9px;
color: #B5BB8B;
font-size: 20pt;
 font-family: Trebuchet MS;
font-variant: small-caps;
text-align: center;
width: 80%;
margin: auto;
text-decoration: underline;
text-shadow: 2px 2px 3px #30382B;
font-weight: 800;
letter-spacing: 2px;
box-shadow:  -2px -2px 10px 8px #1B2415;]Important Tid-bits[/div]
 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA]This thread is for Out of Character chatting and questions. If you want to sign up a character for this roleplay, than follow the instructions specified in this thread here. This group roleplay has an Iwaku clan related to it. This clan host archives of roleplay information and roleplay perks. If you are interested you can become a member here.

 [IMGA=left]http://i.imgur.com/KeHx5Dc.png[/IMGA]We also have a discord server that hosts weekly roleplay activities. The server is the best way to contact me. There are also  island allegiance colors you can be assigned in the server as well. The invite for the server is here. Eventually when the In Character thread is ready to be posted, there will be a link to it here. Thank you for reading, and I hope you will enjoy S.I.K. as much as I do.

[hr=border: 15px solid transparent; padding: 0px; -webkit-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; -o-border-image: url(http://i.imgur.com/02E4lfw.png) 50 round; border-image: url(http://i.imgur.com/02E4lfw.png)  50 round;][/hr]
 [/div]

 [center][img]https://i.imgur.com/T39ko2F.png[/img][/center]

 [/div]

Here is my Test Chamber
 
INTEREST CHECK - Dragon Age

How do I separate the 'fields' or 'borders' so that they aren't within one another but have them as separate boxes within the same post?
 

Err... Which post in there did you want us to look at exactly? There's quite a lot in there and we're not exactly which one we should be referring to? :'D

As to where to put Pluvy's code into yours, you're going to have to merge them with what's already existing rather than simply inserting the two divs. Since you're already using your outermost div as your scroll div, you can use this as the equivalent of the inner div of Pluvy's code. Currently you're using a percent value for the width, right? You're going to need to change this to a px or any other fixed value (e.g. 800px) for the cheat to work.

So your current first div is gonna look something like this: [spoili]
[div=background: #30382B url(http://i.imgur.com/02E4lfw.png) repeat center fixed;
border: 15px solid transparent;
padding: 15px;
-webkit-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
-o-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
width: <fixed value>;
height: 1372px;
overflow: scroll;
overflow-x: hidden;
margin: auto;
box-shadow: -2px -2px 30px 5px #170400;][/spoili]

Next step is to create a new div that wraps around everything you have so far. This will be the equivalent of the first div in Pluvy's code. As the fish mentioned, the width of this needs to match the width that you've previously set, so do that. Add overflow:hidden to it as well, and that's pretty much it. Your scrollbar should now be hidden.

Code thus far (for the two divs): [spoili]
[div=width: <fixed value>; overflow:hidden;
][div=background: #30382B url(http://i.imgur.com/02E4lfw.png) repeat center fixed;
border: 15px solid transparent;
padding: 15px;
-webkit-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
-o-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
width: <fixed value>;
height: 1372px;
overflow: scroll;
overflow-x: hidden;
margin: auto;
box-shadow: -2px -2px 30px 5px #170400;][/spoili]

Unfortunately, it does more than cut away the scrollbar, it also cuts away your borders. That's easy to fix tho, just move your borders to the first div and that should fix things. I suggest moving your box-shadow here as well as that gets cut away too. Move the margin:auto here as well to centre it.

Final code should look something like this: [spoili]
[div=width: <fixed value>; overflow:hidden; margin: auto; border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round; border: 15px solid transparent; box-sizing:border-box; box-shadow: -2px -2px 30px 5px #170400;
-webkit-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
-o-border-image: url(http://i.imgur.com/m2Et0lV.png) 20% round;
][div=background: #30382B url(http://i.imgur.com/02E4lfw.png) repeat center fixed;
padding: 15px;
width: <fixed value>;
height: 1372px;
overflow: scroll;
overflow-x: hidden;][/spoili]


How do I separate the 'fields' or 'borders' so that they aren't within one another but have them as separate boxes within the same post?
Add their respective closing tags before the openings of the next one.
For example:
[bg=purple][fieldbox="Box One, black, solid"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis blandit arcu eget dolor lobortis condimentum. Quisque volutpat ante in felis vulputate, vel pulvinar risus aliquet. Quisque in turpis porta quam scelerisque ullamcorper eu ut arcu. Donec rutrum tincidunt neque. Quisque maximus nisl non sapien facilisis mattis. Etiam ac felis pellentesque, semper risus faucibus, dignissim tellus. Mauris vitae lorem ut enim ornare volutpat. Aenean auctor nulla mauris. Interdum et malesuada fames ac ante ipsum primis in faucibus. Morbi mi enim, vulputate vel ipsum ut, varius porta nisl. Phasellus vel ante dui. Nunc condimentum tellus augue, non ultrices lorem viverra id. Etiam placerat ante scelerisque purus ornare suscipit. Ut dapibus enim nec fringilla sagittis.[/fieldbox][/bg]

[bg=purple][fieldbox="Box Two, black, solid"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis blandit arcu eget dolor lobortis condimentum. Quisque volutpat ante in felis vulputate, vel pulvinar risus aliquet. Quisque in turpis porta quam scelerisque ullamcorper eu ut arcu. Donec rutrum tincidunt neque. Quisque maximus nisl non sapien facilisis mattis. Etiam ac felis pellentesque, semper risus faucibus, dignissim tellus. Mauris vitae lorem ut enim ornare volutpat. Aenean auctor nulla mauris. Interdum et malesuada fames ac ante ipsum primis in faucibus. Morbi mi enim, vulputate vel ipsum ut, varius porta nisl. Phasellus vel ante dui. Nunc condimentum tellus augue, non ultrices lorem viverra id. Etiam placerat ante scelerisque purus ornare suscipit. Ut dapibus enim nec fringilla sagittis.[/fieldbox][/bg]


Code: [spoili]
[solid=purple][bg=purple][fieldbox="Title one, black, solid"]Content goes here.
[/fieldbox][/bg][/solid]
[solid=purple][bg=purple][fieldbox="Title two, black, solid"]Content goes here.[/fieldbox][/bg][/solid]
[/solid][/spoili]
 
I meant the very first div box within the thread, sorry if I didn't clarify before. Thank you, it hid the scrollbar nicely!
 
Status
Not open for further replies.