Exit

What Are You Listening To?

_{__70.}

.

____________________________.

^{__hummingbird is good too.__}_______________________________.

A GUIDE ᵇʸ ᴱˣᴵᵗ

____________________

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ _______________________________________________________.......... . . . 01._______________ A TEXT BOX and how to do it. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

________________________

___________ . . contents

PART ONE PART TWO PART THREE PART FOUR PART FIVE PART SIX

Building your text box. Extending your text box. Determining the width of your text box. Positioning your text box. Customizing your text box. Doing more with your text box.

PART ONE

Building your text box.

_{We'll start with a table with borders active so we can see what we're doing. You can use the following code:}
[table=bordered][row][/row][row][cell][/cell][cell][/cell][cell][/cell][/row][/table]

<sub>Which should give you the following:


This is a pretty basic table with a top row that has no cells. Each cell, including the empty top row, has a job:</sub>

0 _{This row holds the top wall of your text box:}

1 This cell holds the left wall of your text box.	2 This cell holds the body of your text.	3 This cell holds the right wall of your text box.

_{Next, we introduce a string of code to our top row that defines the position, style and color of the top wall of our text box:}

[sub][h1][sub][color=black][sub][sub][color=2e2c2c].[sub][sub][sub][sub][sub][sub][sub][sub][sub]..................[/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/color][sup][b]▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇[/b][/sup][/sub][/sub][/color][/sub][/h1][/sub]
_________________{code goes here}
____________________↓
[table=bordered][row] [/row][row][cell][/cell][cell][/cell][cell][/cell][/row][/table]

_{When combined and posted, your table should look like this:}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

_{Notice that the black bar, which is in the top row, is intersecting the cells in the row below it which is exactly what we want. Next, we introduce code into the left and far right cell that defines the height, color and style of the walls of our text box:}

[sup][b][color=black][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][/color][/b][/sup]
_____________________________________{code goes here}______________________{and here}
________________________________________↓___________________________↓
[table=bordered][row]TOP[/row][row][cell] [/cell][cell][/cell][cell] [/cell][/row][/table]

_{Your table should now look like this:}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █		█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

_{Right now, the walls of our text box is defaulting to the formatting of the table we're building it on top of. The walls are aligned left and because the middle cell has nothing in it, the table is giving priority to the outside cells resulting in the text box's odd shape. We can fix that by adding in some text in the center box.}

__________________________________________________________{text goes here}
____________________________________________________________↓
[table=bordered][row]TOP[/row][row][cell]LEFT[/cell][cell] [/cell][cell]RIGHT[/cell][/row][/table]

_{With text, your table should adjust and now look something like this:}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █	Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum.	█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

_{You'll notice that our text is flush with the top bar. You can give it some space by inputing an invisible character above your first line of text. Something as simple as this will do:}
[color=2e2c2c].[/color]

_{Giving you this:}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █	. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum.	█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

_{So now we have three sides of our box and the text inside it. To get our bottom border in place, we'll be using identical code to the top border with one minor difference: Instead of [sub] tags, this code uses more [sup] tags. This string is placed right at the end of the original table code.}

[sup][h1][sup][color=black][sup][sup][color=2e2c2c][sub][sub][sub][sub][sub]..........[/sub][/sub][/sub][/sub][/sub][/color][sub][b]▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇[/b][/sub][/sup][/sup][/color][/sup][/h1][/sup]

________________________________________________________________________________________________{code goes here}
____________________________________________________________________________________________________↓
[table=bordered][row]TOP[/row][row][cell]LEFT[/cell][cell]TEXT[/cell][cell]RIGHT[/cell][/row][/table]

_{Your table should now look like a box.}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █	. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum.	█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

^{_{..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

_{Simply remove the border from the table by deleting "=bordered" from the table code, and you'll get your finished text box.}
________remove
_________↓
[table=bordered][row]TOP[/row][row][cell]LEFT[/cell][cell]TEXT[/cell][cell]RIGHT[/cell][/row][/table]BOTTOM

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █	. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum.	█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

^{_{..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

PART TWO

Extending your text box.

_{So now we have a text box. Lets say you want to add more text:}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █	. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et.	█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

^{_{..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

<sub>We are now into the more tedious aspects of using text boxes. Because the walls of our text box are independent of the text in the middle cell, the walls will not automatically adjust to the length of the body of your post. These will have to be manually adjusted. You'll learn pretty quickly that the preview button is your friend.

Changing the code is simple once you get the hang of out, but very confusing the first time. Here is the code again for one of our walls:</sub>

[sup][b][color=black][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub][/color][/b][/sup] _________________________________________

. . This string: [sub][h2][sup]█[/sup] [sub]█[/sub][/h2][/sub] represents a single vertical "█", or more specifically two overlapped. This entire string must either be added or removed to shorten or extend the walls.

_{So, if we add that string to the border code near the end, right before the last [/color] tag like so:}

[sup][b][color=black][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][/color][/b][/sup]

_{You get this:}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █	. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et.	█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

^{_{..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

_{Now, it's a simple matter of copying and pasting all the code in one cell into the opposite cell. When done correctly, you'll have a successfully extended text box.}

_{...................^{▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █	. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et.	█ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █

^{_{..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇}}

PART THREE

Determining the width of your text box.

<sub>Maybe you want a text box of a certain width? There are a few ways to do this, but the method I'm sharing allows for the most freedom when it comes to adding elements around your box and is the most flexible with adjustments. You will need a new table with which we will nest our already completed text box within.

Here is our code so far:</sub>

[table][row][sub][h1][sub][color=black][sub][sub][color=2e2c2c].[sub][sub][sub][sub][sub][sub][sub][sub][sub]..................[/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/color][sup][b]▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇[/b][/sup][/sub][/sub][/color][/sub][/h1][/sub][/row][row][cell][sup][b][color=black][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][/color][/b][/sup][/cell][cell][color=2e2c2c].[/color]
[color=gray]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum.

Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et.[/color][/cell][cell][sup][b][color=black][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][/color][/b][/sup][/cell][/row][/table][sup][h1][sup][color=black][sup][sup][color=2e2c2c][sub][sub][sub][sub][sub]..........[/sub][/sub][/sub][/sub][/sub][/color][sub][b]▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇[/b][/sub][/sup][/sup][/color][/sup][/h1][/sup]

_________________________{we'll put all of that here}
_______________________________↓
[table][row][cell][/cell][cell] [/cell][/row][/table]

_{I've bordered mine so it's easy to see what we're doing. This is the result below.}

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

_{Now lets remove the same amount of 'block' characters from the top and bottom borders.}

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

_{There should now be a noticeable gap between the top and bottom borders and the right wall of the text box. We fix this by adding 'weight' to the left cell of the outermost table in the form of a solid line: "________". Normally we would put this within a color tag that makes it invisible. I will be leaving it visible for this example.}

_______________{line goes here}
__________________↓
[table][row][cell] [/cell][cell][TEXT BOX][/cell][/row][/table]

______________________________________________ This solid line is maintaining the width of our text box as determined by the length of the text box's top and bottom borders.

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

_{Here I've removed the table border as the border itself will have an affect on the alignment of our text box walls.}

______________________________________________

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

_{You'll notice that the left and right walls will have to be extended again to compensate for the body of text stretching as the space it is in shrinks in size. We've already gone over how to do that so let's go ahead and fix that now. I'll also hide the line we placed in the empty cell.}

______________________________________________

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

<sub>Now, if you're like me and you get anal about the small details, you'll also notice that the right wall is no longer perfectly aligned with the top border.

To adjust the position of the right wall, you'll need to add a line to the cell that is holding the body of your post. If you remember, we added a single invisible "." just above your first line of text. We can expand that across the entire cell the same way we added a line to the left most cell of the outer table. The length of this line will have to be determined manually and will be specific to each text box you create.

We start with a simple solid line like so: "_________________________________". However, these alone will typically not be enough to perfectly align your walls with the top and bottom border. It will often under or overshoot it with no option in between. To solve this, we get as close as we can with the solid line and then add a single '.' at the end surrounded by '[sub]' tags. The amount of tags used will be determined by you as you add or remove them to align your walls. If necessary, you can also add more '.' if everything is not quite lining up.

For my example, this is the final solid line, '[sub]' and '.' combination.</sub>

________________________________________________________[sub][sub][sub][sub][sub]..[/sub][/sub][/sub][/sub][/sub]

_{Like the line maintaining the shape of our text box, this will typically be placed within a color tag making it invisible, but I'm keeping it visible here.}

______________________________________________ . . It's also worth pointing out that the line placed within the text box will act as a 'skeleton', preventing your text box from being further compressed by the weight of outside cells. However, it will not prevent your text box from expanding horizontally should those outside cells be removed or their weight reduced and priority transferred to the text box.

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ________________________________________________________.. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. Semper viverra nam libero justo laoreet. Tristique senectus et netus et. Varius vel pharetra vel turpis. Nisl nisi scelerisque eu ultrices vitae auctor eu augue ut. Lacus sed turpis tincidunt id aliquet risus feugiat in. Sed viverra ipsum nunc aliquet bibendum enim facilisis gravida neque. Nisi porta lorem mollis aliquam ut porttitor leo a diam. Senectus et netus et malesuada fames ac turpis egestas. Id leo in vitae turpis. Eget gravida cum sociis natoque penatibus et. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

PART FOUR

Positioning your text box.

_{To make things a little easier for me going forward, I will be reducing the vertical height of my text box and because I don't want to look at it anymore, that first line will be covered up.}

______________________________________________ Much better. So from here, we can do things like swapping the cells in the outermost table so our text box is on the left instead of the right.

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ________________________________________________________.. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

_{The easiest way to do this is to grab the entire cell. So this:}
________________________________←[cell][TEXT BOX][/cell]
[table][row] [cell][LINE][/cell][cell]→__________________[/cell][/row][/table]

_{Becomes this:}

[table][row][cell][TEXT BOX][/cell][cell][LINE][/cell][/row][/table]

_{Which gives you this:}

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ________________________________________________________.. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

______________________________________________ Easy as that.

_{Would you like it more in the center? That is a simple matter of adding a new cell next to your text box so that there is a cell flanking it on either side. Then, you simply cut any length of the line you've already created (the one maintaining the weight of the empty cell), and paste it into the new cell.}

_________________________________________________________✂________
_____________________ ↓ _______________________________________↑
[table][row][cell] [NEW CELL] [/cell][cell][TEXT BOX][/cell][cell][LINE][/cell][/row][/table]

____________________

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ________________________________________________________.. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

________________________

PART FIVE

Customizing your text box.

_{So now you have a working text box that is a specific size and in your preferred position, but maybe you'd like it to be a different color or a different style. Changing the color is as simple as locating and replacing the color codes specific to the border walls. It might sound intimidating considering your code might look a little convoluted at this point, but once you know what you're looking for, it's pretty easy to find and change. For this example, I've isolated the code for the top border and one of the borders on the side and highlighted the color tag that can be changed. These will be the same on their counterpart.}

[sub][h1][sub][/color][color=black][sub][sub][color=2e2c2c].[sub][sub][sub][sub][sub][sub][sub][sub][sub]..................[/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/color][sup][b]▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇[/b][/sup][/sub][/sub][/color][/sub][/h1][/sub]

[sup][b][color=black][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][sub][h2][sup]█[/sup]
[sub]█[/sub][/h2][/sub][/color][/b][/sup]

_{Here is what a successful color swap might look like:}

____________________

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ________________________________________________________.. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

________________________

<sub>The next question is if we can change the border to a different style. The quick and easy answer is yes, but in practice, it's difficult and tedious. Picking a different block element or symbol as the character for our border will change its shape. There is no guarantee that the borders of our text box will line up once the characters have been replaced.

While explaining the 'why' would be a nightmare for me to do in a guide, what I can do is try to show you how I would fix any issues I'd run into if I wanted to change the style of our text box to something else. We'll start with the above box and simply swap out every individual character with another. For this new example, I'll be using '═' for the top and bottom, a corner piece like so '╔' for the appropriate corners, and '║' for the sides.</sub>

____________________

...................╔══════════════════════════════════════════════════╗ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ________________________________________________________.. So as you can see, we're running into issues with alignment on both sides and the top and bottom borders do not reach all the way across. But you might also notice that the top border seems smaller then the side walls. The difference is slight but its noticeable. Again, I'm figuring this out now along with you. What I want to try to do right now is adjust the overall size of that top bar. It's too small because it's been [sub] tagged one too many times, a necessity before when the block element for our previous text box was a different size than the right and left walls (did you ever notice they were not the same character?). ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ..........╚══════════════════════════════════════════════════╝

________________________

_{Here is the isolated code for the top bar, pulled out of the cell. I'll be marking the part of the code I've decided to remove.}

[sub][h1][sub][color=#ae2937][sub][sub][color=2e2c2c].[sub][sub][sub][sub][sub][sub][sub][sub][sub]..................[/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/sub][/color][sup][b]╔═══════════════════════════════════════════════════════════════════╗[/b][/sup][/sub][/sub][/color][/sub][/h1][/sub]

_{Removing that [sup] tag serves two purposes. First, it'll enlarge the top bar by a little since every use of the [sub]/[sup] tags further shrinks the affected text. Second, because [sup] moves the affected element up slightly, removing it will drop it down further. Here it was it looks like now:}

____________________

...................╔══════════════════════════════════════════════════╗ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ________________________________________________________.. Not bad! As luck would have it, the left wall is now more perfectly aligned with the top border. The right wall needs to be adjusted again but we already know how to do that. But what about the bottom border? ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ..........╚══════════════════════════════════════════════════╝

________________________

_{The code here is similar but different enough that we cannot remove the same tag that we did from the top border. I'm going to remove something else, as marked below.}

[sup][h1][sup][color=#ae2937][sup][sup][color=2e2c2c][sub][sub][sub][sub][sub]..........[/sub][/sub][/sub][/sub][/sub][/color][sub][b]╚══════════════════════════════════════════════════╝[/b][/sub][/sup][/sup][/color][sup][/h1][/sup]

_{Again, this will both enlarge the text and move it slightly down.}

____________________

...................╔══════════════════════════════════════════════════╗ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ________________________________________________________... And now we're at the final stretch. As you can see, after we changed the size of the lower border, it's moved slightly. Thankfully, there is a section already built into the code can be easily adjusted to fix this. ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ..........╚══════════════════════════════════════════════════╝

________________________

_{I've highlighted the important bit. By adding or removing ellipses or adding or removing [sub]/[sup] tags, we can adjust the border left or right. This can also be applied to the top border.}

[sup][h1][sup][color=#ae2937][sup][color=2e2c2c][sub][sub][sub][sub][sub]..........[/sub][/sub][/sub][/sub][/sub][/color][sub][b]╚══════════════════════════════════════════════════╝[/b][/sub][/sup][/color][/sup][/h1][/sup]

____________________

...................╔══════════════════════════════════════════════════╗ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ________________________________________________________... And there you have it! After a lot of headaches and tedious adjusting all done by eye, you have a fully customized text box that everyone on mobile cannot appreciate. ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ ║ .......╚══════════════════════════════════════════════════╝

________________________

PART SIX

Doing more with text boxes.

_{So what else can we do? How about a single row table with custom borders? All you have to do is add additional cells. Some adjustment to your text box may be necessary.}

[table][row][TOP][/row][row][cell][LEFT][/cell][cell][TEXT BOX][/cell][cell][CENTER][/cell][cell][TEXT BOX][/cell][cell][RIGHT][/cell][/row][/table][BOTTOM]

____________________

...................▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ _________________________.... Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ _________________________.... Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

________________________

_{Want to break up the border for some fun? You can use the following code for the top border. Again, some adjustment may be necessary:}

[sub][h1][sub][color=black][sub][sub][color=2e2c2c][sub]...[/sub][/color][sup][b]▇▇▇[/b][/sup][/sub][/sub][color=2e2c2c]_[sub][sub][sub][sub].[/sub][/sub][/sub][/sub][/color][sub][color=white][color=#a5854a]F[/color] U N[/color][/sub][sub][sub][color=2e2c2c]_[sub][sub][sub][sub].......[/sub][/sub][/sub][/sub][/color][sup][b]▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇[/b][/sup][/sub][/sub][/color][/sub][/h1][/sub]

____________________

...▇▇▇_.F U N_.......▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ _________________________.... Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ _________________________.... Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ..........▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇

________________________

_{And that's as much as I've figured out on my own. I sincerely hope the above is helpful and someone can make use of it for their own creations. Feel free to reply here or DM me if you have questions. I will probably organize them somewhere into a faq. Also please, I'm sure there are ways to vastly improve the above code to make it more efficient or clean or user friendly. Please let me know what can be improved.}

A GUIDE ᵇʸ ᴱˣᴵᵗ

<sub>I've been wanting to make a guide for a while now that kind of helps explain some of the weird bbcode tricks I make use of. I've just never been really good at organizing my thoughts into something that others can read. Things come to me in bits and pieces and sometimes out of order and I can never figure out where to place them. So, I've decided I'm just going to do it and hopefully whatever I end up stitching together will be to someone's benefit. Maybe someone else who is better at organization can come through later on and make a cleaner, more clear version of this.

This isn't going to be an in-depth look into how each element of the code I'm using works. This is going to assume that either you already understand or you do not and just want the pieces that you can put together yourself like a Lego set. If you want to better understand what's in use here, [SUP]ERSTARS – Advanced BBCode Hacks 1 and STRONG AND S[TABLE] – Advanced BBCode Hacks 2 are two guides by the amazing @Roach that perfectly explain the mechanics of our weird bbcode system and how to make it your own. They also contain two specific bbcode techniques that I use in excess.

I'd like to point out that I don't know anything about actual coding. It might also be important to consider that some of this may become irrelevant when and if Mahz pushes through changes to our bbcode. I can't guarantee that taking the time to figure this out for yourself won't ultimately be wasted effort. That being said, no one's going to stop me from wasting my own time, so...

I will be making two guides (you can f3 to the number):

01. Text Boxes ^broken
02. Tabs ^broken

edit:082925.11:45</sub>

so the tab switching lasted all of 20 days :) i'll have to do further testing to see how recent changes may be affecting the rest of the code i use.

________________________________________________________________________________________________________

_{edit:043026.11:13}

what I didn't realize is that text boxes also broke for similar reasons and at the same time that tab switching broke. neither are possible with the techniques described below.

________________________________________________________________________________________________________

_{Please keep in mind that nothing I do here will be mobile friendly.}

What's the reason behind your Username?

A long time ago, there was this place called myspace where you were given this sliver of the internet to use as a canvas to express yourself. People would use html to decorate it in all sorts of ways, typically in that very distinct late 2000's style. Small, looping animations. Tiled backgrounds of your favorite person. Automatic playlists. There was a lot of glitter. A lot of hot pink. A lot of just stuff kind of everywhere and it was amazing.

Anyways, some people had this 'sign' at the top of their profile that said "Restrooms This Way ->".

I thought I'd be cool and different and put "Exit This Way->" at the top (I even had it scrolling horizontally across the page). I couldn't tell you why I decided to make it my username but I do remember using it first on PSN and then IMVU and finally RPG when I first joined. People started calling me Exit pretty much everywhere online, and like Kuro mentioned earlier, it kind of became my 'brand'. It worked really well as a shortened nick of my full username and I liked that it was a brief four letters and the way it sounded. After guildfall, I took the opportunity to change it to Exit and have been Exit ever since.

C O N C E P T S ᵇʸ ᴱˣᴵᵗ

_{.ex/t080425.13:23}

there is a buffer created by nesting hiders. limit one tab, otherwise spacing becomes awkward. manual adjustments everywhere but it looks good if you have the patience.

_{FOUR. CS Concept.}

_____________________________________ . . .

[+] ...▇▇▇_.V Y S K A _...▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Inheritor of the SynEn corporation. Vyska is the daughter of Mynwa Moon and currently lives in the Upper Ring. She devotes herself tirelessly to her family's company, working hard to uphold the weight of the Moon name and make good of their legacy of sustainable energy provided to all corners of Ba Sing Se. In a year's time, she is expected to take over the business completely from her father who is looking to retire. Vyska is also a practitioner of self-defense and owns a synergy handgun. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ...▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ ______________________________________________________.. ____________________________________________________________

. ...▇▇▇_.V Y S K A _...▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Age. 20 Gender. Female Residence. Upper Ring Occupation. COO of SynEn Element. Fire Form. Fire Level. • ____________________________________________________________ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ...▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ ______________________________________________________..

____________________________________________________________

_{FIVE. IC Concept (not real or open).}

_____________________________________ . . .

[+] ...▇▇▇_P L O T _..▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur. █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ...▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ ______________________________________________________.. ____________________________________________________________

. ...▇▇▇_T H E M E S _..▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ . . . nsfw · open · ♫ some sci-fi · action · spy · romance (enemies to lovers) mr. & mrs. smith · spy family · day of the jackal . . ____________________________________________________________ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ █ ...▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ ______________________________________________________..

____________________________________________________________

C O N C E P T S ᵇʸ ᴱˣᴵᵗ

_{.ex/t080125.23:32}

managed to mostly solve the alignment issue by using sub/table glitch behavior. it is now significantly less jittery during tab siwtching. yay me.

_ONE.

_____________________________________

[+] TAB TWO Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. ____________________________________________ ____________________________________________________________

. . TAB ONE Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. ____________________________________________

____________________________________________________________

_TWO.

_____________________________________

[+] First Last • age: xx • gender: xxxx History: Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. ____________________________________________ ____________________________________________________________

. . First Last • age: xx • gender: xxxx Appearance: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Personality: Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. ____________________________________________

____________________________________________________________

_THREE.

. _____________________________________ .

[+] First Last • age: xx • gender: xxxx History: Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. . _______________________________________________ . . . . . . . . . . . . ____________________________________________________________

. . First Last • age: xx • gender: xxxx Appearance: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Personality: Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. _______________________________________________

. . . . . . . . . .

____________________________________________________________

What Are You Listening To?

_{__69.}

.

____________________________.

^__nice._________________________________.

C O N C E P T S ᵇʸ ᴱˣᴵᵗ

_{.ex/t080125.07:42}

this is probably a health hazard to mobiles devices. wip. this takes advantage of the no horizontal scroll bar, pushing elements outside border to 'hide' it and make it look like you're looking at a different 'page'. i wish i could position the two tabs closer together but it's off by a few pixels. trying to adjust positions so transition between tabs isn't so jarring.

_♫
♀♂

Last, First xx ♂ #.👁.୭ ♫
_____________________________________	[+] TAB TWO Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. __________________________________________ __________________________________________________________________	. . TAB ONE Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget aliquet nibh praesent tristique magna. Cursus vitae congue mauris rhoncus aenean vel. Integer vitae justo eget magna fermentum iaculis eu non. Nibh sit amet commodo nulla facilisi nullam. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Viverra aliquet eget sit amet tellus. Egestas congue quisque egestas diam in arcu. Velit scelerisque in dictum non. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Eu feugiat pretium nibh ipsum. ____________________________________________	____________________________________________________________

_____________________________________

[+] History Orci nulla pellentesque dignissim enim sit amet venenatis urna cursus. Ac turpis egestas maecenas pharetra. Nisl suscipit adipiscing bibendum est. Amet justo donec enim diam vulputate ut pharetra sit amet. Enim neque volutpat ac tincidunt. Libero volutpat sed cras ornare. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elementum curabitur vitae nunc sed velit dignissim sodales. Ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed felis eget velit aliquet sagittis id consectetur purus ut. __________________________________________ __________________________________________________________________

. . Last, First age xx gender xx extra xx ____________________________________________

____________________________________________________________

_₧№™

What Are You Listening To?

_{__68.}

.

____________________________.

^__1_________________________________.

Look! Up in the sky! It's a bird! It's a plane! It's...another roleplayer

Please get down from there. It is dangerous.