# Formatting Sandbox – Please test stuff here

What the title says.

Use this for testing stuff and gosh I can't believe we didn't have this till now.

### Can this header be bold enough? Nope.

#The biggest, baddest header

### **Can this header be bold enough?** Nope.

# Trick no. 2: Lines

Adding --- or ___ will add a line that visually looks like this:

If you want the line bold, add a # before ___. Tho' to get the impression of a line you need to do some copy-paste or keyboard press determination.

# __________________________________

#----------------------------------

#__________________________________


# Trick no. 3: Misc

• You can
1. nest
2. numbered or unenumerated
• lists.
3. Yay!

Studies™ prove that a shocking number of users don't know that two spaces at the end of a line can break the line, like a <br/>.

I am a cool person.
You have no idea how cool you are too.

I am a cool person.
You have no idea how cool you are too.

I am a cool person. You have no idea how cool you are too.

> I am a cool person.
You have no idea how cool you are too.

> I am a cool person. <br/>
You have no idea how cool you are too.

> I am a cool person.
You have no idea how cool you are too.


(There are two spaces after "person" in the first line of the first showcase)

# Secrets

Use >! for spoilers and if you ever want a redacted effect without actually redacting anything.

The >! formatting works for images also

<span style="text-decoration: blink;">Text to blink here</span> Span Doesn't work
Peter's exuberant use of bolding in his answers make me grateful the blink tag doesn't work That's not nice It's not that mean though

<kbd>Q</kbd><kbd>W</kbd><kbd>E</kbd><kbd>R</kbd><kbd>T</kbd><kbd>Y</kbd>
QWERTY

1. Markup ordered list item
43. It's OK if the numbers are out of order
8. Another list item

1. Markup ordered list item
2. It's OK if the numbers are out of order
3. Another list item
• Does <kbd> work in comments? <kbd>tilde</kbd> Mar 16, 2016 at 13:17

# Working with Images

Changing the displayed size by adding a suffix

If you upload your image to Imgur, adding a character to the end of the image name before the extension will change the displayed size in your post. The square suffixes (s and b) do not keep the proportions of the images but the rest of them do. There may be some problems with resizing PNGs that have a transparent background.

s - small square 90x90
b - big square 160x160
t - small thumbnail 160x160
m - medium thumbnail 320x320
l - large thumbnail 640x640
h - huge thumbnail 1024x1024

 [![My cat Loki][1]][1]
[1]: https://i.stack.imgur.com/SpjyG.jpg


Displayed as a medium thumbnail (m) that opens the original size when you click:

[![My cat Loki][2]][1]
[1]: https://i.stack.imgur.com/SpjyG.jpg
[2]: https://i.stack.imgur.com/SpjyGm.jpg


Also, you don't have to use numbers to mark the images; you can use any string. You can also add a description that will appear as a tool tip for any link by putting it in quotes after the URL. For example:

[![My cat Loki][Thumbnail]][Full]
[Full]: https://i.stack.imgur.com/SpjyG.jpg "click for full-size image"
[Thumbnail]: https://i.stack.imgur.com/SpjyGs.jpg


You don't have to link to an image either - any link will work:

[Thumbnail]: https://i.stack.imgur.com/SpjyGs.jpg


When the resizing doesn't work, or if you want to choose a size other than the standard sizes, you can use HTML and still link to the full sized image:

[<img src="http://i.stack.imgur.com/SpjyG.jpg" width="200" alt="My cat Loki"/>][1]
[1]: https://i.stack.imgur.com/SpjyG.jpg


Be sure to put your width and height tags before the "alt" tag or your image may not be displayed:

[<img src="http://i.stack.imgur.com/SpjyG.jpg" alt="My cat Loki" width="200"/>][1]


• Great tip for resizing huge images, will save users lots of time. Thanks. Pity about SE not allowing users to centre images. Nov 13, 2016 at 12:48
• @Mari-LouA I think the <center> tag and the align attribute for <img> aren't supported in HTML 5, so centering things that the page doesn't always center is a lot more complicated. I'll see if I can figure out any way to do it. Nov 13, 2016 at 12:53
• @Mari you can use <pre>, or in Mathjax-supported sites, \hspace. That said, meta.chemistry.stackexchange.com/questions/3044/… Nov 14, 2016 at 12:32
• @M.A.R. Yes, we have a link to that in a different answer, but I think folks were overlooking it. Also, our community doesn't all have community wiki editing privileges on the other site, which makes it difficult to test stuff. <pre> won't center it, it will just indent it by a fixed amount and because the mobile site does center, it's unclear to me whether <pre> would undo that entirely. Nov 14, 2016 at 12:46
• Wow, I had no idea you could use something other than numbers! Thanks, that'll definitely make things less confusing for me in the future :-)
– user230
Mar 27, 2018 at 16:17

Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing
Horizontal spacing

Hint:
You can copy and paste the space between these two arrows to move your text: →　←

# Would you like

look smaller

and smaller

and smaller

and smaller

and smaller?

Eeek!

# Would you like

**look smaller**

<sub>**and smaller**</sub>

<sub><sup>**and smaller**</sub></sup>

<sub><sup><sub>**and smaller**</sub></sup></sub>

<sub><sup><sub><sup>**and smaller?**</sub></sup></sub></sup>

<sub><sup><sub><sup><sup>**Eeek!**</sup></sub></sup></sub></sup>

• I wish it worked in comments. SE hates fun. :( Oct 10, 2016 at 18:16
• It's best to avoid making text very small, most of the time. People have trouble reading it.
– user230
Nov 13, 2016 at 19:11
• @snailplane it's only for fun that I posted it as small as it could go. Certainly, one could do steps 3 and 4, without affecting legibility. It's very useful tip for shortening the amount of space long book titles take up. Nov 13, 2016 at 19:15

Did you know you can use HTML character escape codes?

You can use the name from the first column of that table :

&mdash; &ndash; &para; &hellip; &uarr; &darr; &larr; &rarr; &copy; &pound; &Otilde; &check;
— – ¶ … ↑ ↓ ← → © £ Õ ✓

Or the numbers by adding #:

&larr; &#8592; &#120;
← ← x

SoundCloud links don't work here, but they do on other meta sites.

https://soundcloud.com/stack-exchange/stack-exchange-podcast-63-the-plumbers-up-to-67-coins

• Does &larr; work in comments ? Apr 23, 2018 at 19:47

I can't delete it right away. So someone like @IͶΔ could read something embarrassing I write here and use it to blackmail me.

• Just write whatever you like here. I promise I wouldn't read it more than 5 times a day. Feb 16, 2016 at 18:41
• O.O 11 more to go. Oh. That was 11. Feb 17, 2016 at 17:04

# Working with block quotes

### Separating quote blocks

> This is my first quote.

<!-- I want a blank line between them so I am using an HTML comment. This could be empty. -->

> This is my second quote

This is my first quote.

This is my second quote.

### Nesting quotes

> Sometimes I want to quote something
>> Inside a block quote.

> And then keep writing the rest of the quote. I need to put a blank line to get out of the nested quote.

Sometimes I want to quote something

Inside a block quote.

And then keep writing the rest of the quote. I need to put a blank line to get out of the nested quote.

#　　　　　　　　　　　　　¯\(ツ)

#　　　　　　　Does this thing appear at the centre?

• It looks completely weird on the android app, I just checked.
– NVZ
Jul 31, 2017 at 19:58
• Should I delete this after test run? Or keep it here for just fun?
– NVZ
Jul 31, 2017 at 20:01
• Nah, why delete? This post would be useful for future tests Aug 1, 2017 at 5:12
• @M.A.R. Alright. It will stay then. :)
– NVZ
Aug 1, 2017 at 5:12
• Does this work on comments? (EDIT: It doesn't.)
– NVZ
Aug 1, 2017 at 7:37
• <del>strikethrough text</del>
– NVZ
Aug 2, 2017 at 20:20
• There's no way to get strikethrough text in comment except ugly Unicode. --- works in chat, and <s> works on the main site. Aug 3, 2017 at 4:52

Testing the Tool tip,

• is working for a link?

• is working for the image?

Abusing the <kbd> tag to add outlines around images:

## Tables

First row
Second row
| A header | Another header |
| -------- | -------------- |
| First    | row            |
| Second   | row            |

Left Center Right
First row 124689
Second row 975257
| Left  | Center | Right |
|:------- |:-------:| ----:|
| First    | row | 124689 |
| Second   | row | 975257 |


There is an answer for the main Table Support "new feature" post that shows how to use HTML to incorporate different types of formatting into table cells.

Testing "magic" links [engineering.se] [ell.se] [interpersonal.se]

• Magic links do work in comments though: Interpersonal Skills [interpersonal.se]  works in the comments. Mar 24, 2018 at 12:16