How to make nice ASCII borders

DeathRay2K · Commander **Joined**: 01 Sep 2002 **Location**: Canada

There are several kinds of borders that you can use, and you can combine them using the correct ASCII character. The point is, if you've been alive long enough to have played old text dos games, then you've probably seen these before. And now you'll know how to use them on the internet using special codes and fixed-width text. (Which someone doesn't see a need for...)
So, I will use the [code] tags, which make things a bit more difficult.

First of all, these are all of the characters that you need:

Code:

─ │ ┌ ┐ └ ┘ ├ ┤ ┬ ┴ ┼ ═ ║ ╒ ╓ ╔ ╕ ╖ ╗ ╘ ╙ ╚ ╛╜ ╝ ╞ ╟ ╠ ╡ ╢ ╣ ╤ ╥ ╦ ╧ ╨ ╩ ╪ ╫ ╬ ▀ ▄ █ ▌ ▐ ░ ▒ ▓ ■ □ ▪ ▫ ▬ ▲ ► ▼ ◄

There is one way to force the text to use a fixed-width, and that's the <pre> HTML tag.
I'll show you what I mean with a few examples.

Without <pre>
┌────────┐
│This is │
╞════════╡
│Without │
│the pre │
│tag. │
╘════════╛
░▒▓█

Unfortunately even the pre tag won't fix the vertical spacing on a forum, so I must use the <code> tag for multiline presentations.

Code:

┌────────┐
│This is │
╞════════╡
│with │
│the code│
│tag. │
╘════════╛
░▒▓█

The <pre> tag will do with normal HTML what the code tag does with forums.

Even cool little pictures are possible using the ASCII characters.

Code:

   ░░░░░░░░░░░░░░░░░░
  ░▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒░
░▒▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▒░
░▒▓█▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀█▓▒░
░▒▓█►─═DeathRay2K═─◄█▓▒░
░▒▓█╒══════════════╕█▓▒░
░▒▓█╠──────────────╣█▓▒░
░▒▓██████████████████▓▒░
░▒▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▒░
  ░▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒░
   ░░░░░░░░░░░░░░░░░░

And without fixed-width:

░░░░░░░░░░░░░░░░░░
░▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒░
░▒▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▒░
░▒▓█▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀█▓▒░
░▒▓█►─═DeathRay2K═─◄█▓▒░
░▒▓█╒══════════════╕█▓▒░
░▒▓█╠──────────────╣█▓▒░
░▒▓██████████████████▓▒░
░▒▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▒░
░▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒░
░░░░░░░░░░░░░░░░░░

In fact, even the font that [code] uses isn't optimal, best would be the Courier font.

Now, the HTML codes that make these things work. Find out by quoting this post and seeing for yourself.

_________________

D · Posted: Mon Aug 22, 2005 3:32 am Post subject:

Very nice tutorial, nice to see people going "old skool". :p

_________________

Nuclear General · Scorpion Sniper **Joined**: 30 Apr 2005 **Location**: USA

Ok, I don't get it. That coding is foreign to me lol.

_________________

Denmon · General **Joined**: 12 Jun 2004 **Location**: /S/weden

Its basicly used to make nametags and shit

Code:

   ___ ___ ___
   /\ \ /\ \ /\ \ ___ ___
   /::\ \ /::\ \ /::\ \ /\ \ /\ \
   /:/\:\ \ /:/\ \ \ /:/\:\ \ \:\ \ \:\ \
  /::\~\:\ \ _\:\~\ \ \ /:/ \:\ \ /::\__\ /::\__\
/:/\:\ \:\__\ /\ \:\ \ \__\ /:/__/ \:\__\ __/:/\/__/ __/:/\/__/
\/__\:\/:/ / \:\ \:\ \/__/ \:\ \ \/__/ /\/:/ / /\/:/ /
   \::/ / \:\ \:\__\ \:\ \ \::/__/ \::/__/
   /:/ / \:\/:/ / \:\ \ \:\__\ \:\__\
   /:/ / \::/ / \:\__\ \/__/ \/__/
   \/__/ \/__/ \/__/

Code:

_____ ___ ___ _ _
( _ )( _`\ ( _`\ (_)(_)
| (_) || (_(_)| ( (_)| || |
| _ |`\__ \ | | _ | || |
| | | |( )_) || (_( )| || |
(_) (_)`\____)(____/'(_)(_)

_________________
Please, read the signature rules of the forum.

j4m3sb0nd · Commander **Joined**: 10 Nov 2004

Someone should make a maze with them. Wink

Havoc · Posted: Wed Aug 24, 2005 11:09 am Post subject:

Really old school. It's used in .nfo files for many downloads. They're a good replacement for the sigs.

DeathRay2K · Commander **Joined**: 01 Sep 2002 **Location**: Canada

I'm not going to make a 3D maze with them, because that would take rather a long time. But here ya go!

Code:

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

Its pretty simple, but yeah!

_________________

Nuclear General · Scorpion Sniper **Joined**: 30 Apr 2005 **Location**: USA

Could someone like make a tutorial on this type of coding, that would help out for some people.

_________________

D · Posted: Wed Aug 24, 2005 10:08 pm Post subject:

Are you a retard?

_________________

Clarkson · Posted: Thu Aug 25, 2005 12:02 am Post subject:

YES I AM! LOLZ173!13WTDWTFLOLOMGIGOTABIGK0KGUYEGFGTYUF!!!366253!

_________________
PPM's Reichstrollfuherer, 236th Trollenparties brigade.

DeathRay2K · Commander **Joined**: 01 Sep 2002 **Location**: Canada

Nuclear General wrote:

Could someone like make a tutorial on this type of coding, that would help out for some people.

What else is there to know?

_________________

j4m3sb0nd · Commander **Joined**: 10 Nov 2004

DeathRay2K wrote:

I'm not going to make a 3D maze with them, because that would take rather a long time. But here ya go!

Code:

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

Its pretty simple, but yeah!

Thats class man, good job! Very Happy

If you ever get really bored hough, feel free to make that 3D maze hehe. Wink

friday-13th · Posted: Thu Sep 01, 2005 3:47 pm Post subject:

this is so difficult[/code]