Formatting Sandbox

Question

Notes:

Answers will occasionally be moved to the Sandbox archive when there are too many of them. When using them to report bugs, keep an eye on the post.

You may also want to take a look at the Stack Exchange's Sandbox chat room

This site, Meta Stack Exchange, is usually used as a "test bed" for pending changes happening to the way text is rendered on all network sites. Changes to text rendering that are going to be rolled out to the network are usually deployed here first to test them out and fix any potential glitches. Currently, there are no such changes pending, but if there were, keep in mind that text posted here may render differently from the other sites until the changes roll out to them as well.

As per Jeff's suggestion in this comment:

You can use this question as a formatting sandbox. You can:

edit this question itself (Community Wiki questions such as this one require only 100 reputation to edit instead of 2,000)
post answers to this question (This question might be protected, requiring earning 10 reputation on this site to answer)
post comments to this question or its answers
test suspected bugs with the editor or the rendering
post ponies (only when mods are asleep)

Beware that since the changes to syntax highlighting in December 2010, and the inline hints added in March 2011, no syntax highlighting is applied unless the question's tags or an inline hint enable it. So, to test highlighting here in the sandbox:

As of January 8, 2019, you can use GitHub-flavor fenced code blocks in your posts, specifying the language after the opening fence:

```html
While not hinted otherwise: <html></html> source <b>goes</b> "here".
```

```js
var a = 3;
while (not (a > 0)) {
    alert("JavaScript code <b>goes</b> here.");
}
```

Or:
- Create code blocks in any way (using the fence notation above, the four-space indent form, or using HTML <pre><code> tags).
- Save your post!
- Use your browser's developer tools to edit the resulting HTML. To open developer tools, press F12, or ⌥⌘ I on Mac.
- Find the <pre> element and add the attribute class="prettyprint", or change it into one of the valid syntax hints linked above, like class="lang-vb prettyprint".
- Run the following in the location bar: javascript:prettyPrint(); or prettyPrint() in the console.

Answers that are considered annoying or obnoxious, or that cause breakage for users, will be deleted. This is codified as a policy as of March 29, 2018.

@TheEmpty see here. (TL;DR: anyone who edited can be pinged) — Shadow Wizard Love Zelda, Nov 10, 2023 at 16:44

9pfs · Accepted Answer · 2021-03-15 18:26:25Z

The new code editor:

Heading

Bold

Italic

Inline code

Blockquote

Code block

(Shift + Enter to exit code blocks)

Image

Table (original content header 1	header 2	header 3
cell 1	cell 2	cell 3
cell 4	cell 5	cell 6
cell 7	cell 8	cell 9

Numbered list

Bulleted list

Horizontal rule (above)

User Community - Meta Stack Overflow An attempt to rope @Community into the post (related to a joke on Meta Stack Overflow User Community - Meta Stack Exchange Let's see if it works. [spoiler]experiment-spoiler[/spoiler] Fails. 🙁

Sabito stands with Ukraine · Accepted Answer · 2021-04-16 04:09:24Z

1

Mismatch between preview content and saved content wrt newline separator

https://flathub.org/apps/details/net.sourceforge.Pdfedit\ https://flathub.org/apps/details/com.itextpdf.RUPS

answered Apr 16, 2021 at 4:09

community wiki

Sabito stands with Ukraine

Add a comment |

Scott - Слава Україні · Accepted Answer · 2021-04-24 04:48:12Z

1

Dear Prof. Smith, Prof. Johnson, Prof. Lee, and Prof. Chun,

(note the “and”).

Also, is the email directly relevant to all four professors? Perhaps you should consider “CC’ing” someone that’s not so relevant (in which case the CC’d person need not be addressed in the salutation)?

It’s my first answer here so any feedback is appreciated.

answered Apr 24, 2021 at 4:48

community wiki

Scott - Слава Україні

Add a comment |

3 revs, 2 users 50% · Accepted Answer · 2021-04-26 10:39:42Z

1

This is a test answer to test out a potential bug with edit notifications. Let's see what happens if we add some text.

edited Apr 26, 2021 at 10:39

community wiki

3 revs, 2 users 50%
Sonic the Anonymous Hedgehog

Add a comment |

2 revs · Accepted Answer · 2021-07-05 07:33:37Z

Scenario is I run a hat company, and every year the hat regulator gives us a guideline as to how much we can increase the price:

Year	Price increase
2015	n/a first year
2016	+3.2%
2017	+2.2%
2018	+4.0%
2019	+1.0%
2020	+0.0%
2021	+4.0%

So far, I've worked out how to use product and filter to quite easily produce the following output...

Year	Price increase	Hat price
2015	n/a first year	£3.00000
2016	+3.2%	£3.09600
2017	+2.2%	£3.16411
2018	+4.0%	£3.29068
2019	+1.0%	£3.32358
2020	+0.0%	£3.32358
2021	+4.0%	£3.45653

...But in the real world, I wouldn't apply an uplift of 2.2% to a £3.09600 hat and sell it for £3.16411, I actually want to apply it to rounded numbers, so I'd want to calculate (£3.10 + 2.2%) -> £3.1682 -> £3.17 in 2017 for instance. That's a penny different, and I want to introduce these penny differences as they will accumulate over time in the real world.

Does anyone have any suggestions for how I might build a "real world" calculation, where I'd round the price off every year and only apply the increase to the rounded price? Easy in Excel, but I can't work out a way to do it in Power BI without producing a new column for each consecutive year, which is impractical given the size of the real data set.

Ideally I'd want my data set to look like this...

Year	Hat price last year	Price increase	Hat price this year
2015	n/a	n/a	£3.00
2016	£3.00	+3.2%	£3.10
2017	£3.10	+2.2%	£3.17
2018	£3.17	+4.0%	£3.30

I'd been trying to do something in DAX but I don't think I can direct a calculated column to itself, so I suspect a Power Query solution might be better - but I'm open to a solution in either sphere!

Wolf · Accepted Answer · 2021-07-05 16:09:57Z

:root {
    --xyz-ease: cubic-bezier(.26,2.05,.84,.38);
}

body {
    margin: 0;
    height: 100vh;
    display: grid;
    place-items: center;
    background: #466BDA;
}

.phone {
    background: white;
    padding: 1.5em;
    border-radius: 2em;
    position: relative;
    transform: rotateZ(-45deg);
    box-shadow: -30px 30px 0px rgba(0,0,0,.1);

    &:before {
        content: " ";
        position: absolute;
        background-color: #466BDA;
        border-radius: 1em;
        padding: .5em;
        width: 33%;
        top: -5px;
        left: 30%;
    }
}

.square-group {
    display: grid;
    grid-template-areas:
        "square square"
        "square square";

    .square {
        padding: 3em;
        margin: .6em;
        border-radius: .8em;
        background-color: #466BDA;
    }
}

.skeleton-title, .skeleton-title2 {
    padding: .6em;
    margin: 1em .3em;
    border-radius: .8em;
    background-color:#466BDA;
}
.skeleton-title2 {
    width: 60%;
}

.circle-group {
    display: grid;
    grid-template-areas:
        "circle circle circle"
        "circle circle circle";

    .square {
        padding: 2em;
        margin: .6em;
        border-radius: 50%;
        background-color: #466BDA;
    }
}

the output is big so you wont see

4 revs, 2 users 92% · Accepted Answer · 2021-07-07 15:18:23Z

Test which numbers get interpreted as a link by my phone:

Yes Safari: Why does nobody look at my question, it only has 10000000000000000 views

Yes Safari not including last three 0s, DuckDuckGo not including last three 0s: Why does nobody look at my question, it only has 10 000 000 000 000 000 views

Yes Safari, DuckDuckGo: Why does nobody look at my question, it only has 1000000 views

Yes Safari: Why does nobody look at my question, it only has 42000000000000000 views

Yes Safari: Why does nobody look at my question, it only has 10000000000000000,0 views

2 revs · Accepted Answer · 2021-07-16 00:26:57Z

Well, you clicked on the text!

var i = document.getElementsByTagName('p')[0];
var j=0;
for (j=0; j<=1000; j++) {
  i.innerHTML+="&nbsp;"+j;
}

*{word-break:break-word;}

<p>hello world!<br></p>

(function (window, init) {
    window.addEventListener("DOMContentLoaded", init);
})(window, function () {
    function getRandom(min, max) {
        return Math.floor(Math.random() * (max - min) + min);
    }
    (function (draw) {
        draw();
    })(function () {
        var ctx1 = document.getElementById("canvas1").getContext("2d");
        // ugly image #1
        for (j = 0; j <= 3600; j += 60) {
            for (i = 20; i <= 3600; i += 20) {
                ctx1.beginPath();
                ctx1.moveTo(j, 0);
                ctx1.lineTo(100, i);
                ctx1.stroke();
            }
        }
        // ugly image #2
        var ctx2 = document.getElementById("canvas2").getContext("2d");
        for (i = 0; i < 99999; i++) {
            ctx2.beginPath();
            var color = "rgb(" + getRandom(0, 255) + "," + getRandom(0, 255) + "," + getRandom(0, 255) + ")";
            ctx2.strokeStyle = "";
            ctx2.strokeStyle = color;
            ctx2.moveTo(getRandom(0, 400), getRandom(0, 400));
            ctx2.lineTo(getRandom(0, 400), getRandom(0, 400));
            ctx2.stroke();
        }
        // ugly image #3
        var ctx3 = document.getElementById("canvas3").getContext("2d");
        for (k = 0; k < 50; k++) {
            var color = "rgb(" + getRandom(0, 255) + "," + getRandom(0, 255) + "," + getRandom(0, 255) + ")";
            ctx3.strokeStyle = "";
            ctx3.strokeStyle = color;
            ctx3.beginPath();
            ctx3.arc(getRandom(0, 200), getRandom(0, 200), getRandom(0, 200), 0, 2 * Math.PI, false);
            ctx3.stroke();
        }
    });
    (function (addAnchor) {
        addAnchor();
    })(function () {
        var link = document.getElementById("reload");
        var hash = BigInt(getRandom(100000000000000000000000000000000000000000000000000000000000000000000000, 999999999999999999999999999999999999999999999999999999999999999999999999));
        link.href = "./?hash=" + hash;
    });
});

canvas {
    max-width:600px;
    resize:both;
}

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>Canvas Experiment</title>
</head>
<body>
    <h1>Art Fair <a href="?hash=" id="reload">generate new samples</a></h1>
    <h2>Ropes</h2>
    <canvas id="canvas1" style="width:100%; border:1px solid black; height:100%;">
        <p>AAAAAAAAA... <a href="https://chrome.com">AAA AAAAA AAAAAAAAAAA AAAAAA AAAAAA?</a></p>
    </canvas>
    <h2>Everyone Sees Something Different: 99999 Lines</h2>
    <canvas id="canvas2" style="width:100%; border:1px solid black; height:100%;">
        <p>AAAAAAAAA... <a href="https://chrome.com">AAA AAAAA AAAAAAAAAAA AAAAAA AAAAAA?</a></p>
    </canvas>
    <h2>A Bunch of Circles (50 to be exact)</h2>
    <canvas id="canvas3" style="width:100%; border:1px solid black; height:100%;">
        <p>AAAAAAAAA... <a href="https://chrome.com">AAA AAAAA AAAAAAAAAAA AAAAAA AAAAAA?</a></p>
    </canvas>
</body>
</html>

var $password = 'pass';
document.querySelector('[type=password]').pattern = $password;

function hideAll() {
  var $x = document.getElementsByTagName('center');
  for (var $i = 0; $i < $x.length; $i++) {
    $x[$i].style.display = 'none';
  }
}

function login() {
  hideAll();
  document.getElementById('complete').style.display = 'block';
}

function logout() {
  hideAll();
  document.getElementById('login').style.display = 'block';
}

function forgot() {
  hideAll();
  document.getElementById('forgot').style.display = 'block';
  var $random = Math.random();
  $random = Math.round($random * 10000);
  document.querySelector('[type="password"]').pattern = $random;
  document.getElementById('reset').innerHTML = 'New password: ' + $random;
}

function showLogin() {
  hideAll();
  document.getElementById('login').style.display = 'block';
}

center:not(#login) {
  display: none;
}

input:not([type="submit"]) {
  border: none;
  outline: none !important;
  width: 100%;
}
* {
  font-family: Arial;
}

<center id="login">
  <h2>Log In</h2>
  <a href="#" onclick="forgot()">Forgot Password</a>
  <form action="javascript:;" onsubmit="login()">
    <fieldset>
      <legend>Username</legend>
      <input type="text" required="required" />
    </fieldset>
    <fieldset>
      <legend>E-mail</legend>
      <input type="email" required="required" />
    </fieldset>
    <fieldset>
      <legend>Password (default: pass)</legend>
      <input type="password" required="required" />
    </fieldset>
    <input type="submit" value="Log In" />
  </form>
</center>
<center id="complete">
  <h2>Logged In</h2>
  <a href="#" onclick="logout()">Log Out</a>
</center>
<center id="forgot">
  <h2>Password Reset</h2>
  <p id="reset"></p>
  <a href="#" onclick="showLogin()">&laquo; Back</a>
</center>

8 revs · Accepted Answer · 2021-09-22 19:10:54Z

1

This is a test sentence for testing purposes.

Testing ~ in URLs:

HTML href (<a href="..."></a>)
Markdown footnote link ([text][1])
Markdown inline link ([text](link))

edited Sep 22, 2021 at 19:10

community wiki

8 revs
zcoop98

Add a comment |

Greedo · Accepted Answer · 2021-09-22 20:22:45Z

<!-- language-all: lang-swift -->

Ok I gave a [VBA solution][1] but here's a pure Excel version using the relatively new LAMBDA functions, no VBA. 

To achieve this I have created a named function with signature `printf(mask, tokensArray)` where:
 - `mask` is a string you want to format, containing positional `{}` or indexed `{i}` interpolation locations.
 - `tokensArray` is the set of values to be substituted in, supplied as either a 1D Range (row or column), an array (hardcoded or returned from a function) or a single value.

... and which returns a formatted string. Called from a cell like:

[![Tooltip][3]][3]


[![Usage][4]][4]

    =printf("Some text '{1}', more text: '{2}'", A1:A2) //continuous 1D row/col
    =printf("Some text '{1}', more text: '{2}'", {"foo","bar"}) //hardcoded array
    =printf("Single Value {1}", "foo")

or with positional args (left to right)

    =printf("Some text '{}', more text: '{}'", A1:A2)

---

Define these two functions by entering them in the name manager (see [LAMBDA function][2] MSDN docs for detailed instructions, though this link will die I'm sure...) :

| Param     | Value                                                                                                                                                                                                                                                                                                                                            |
|-----------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| Name      | ReplaceRecursive                                                                                                                                                                                                                                                                                                                                 |
| Scope     | Workbook                                                                                                                                                                                                                                                                                                                                         |
| Comment   | Recursively substitutes {} or {i} with tokens from the tokens list, which it escapes one by one leaving \} in the result string                                                                                                                                                                                                                  |
| Refers To | `=LAMBDA(mask,tokens,i,tokenCount, IF(i >tokenCount, mask, LET(token, INDEX(tokens,i),escapedToken,SUBSTITUTE(token,"}", "\}"),inIndexedMode,ISERROR(FIND("{}",mask,1)),substituted, IF(inIndexedMode, SUBSTITUTE(mask,"{"&i&"}", escapedToken),SUBSTITUTE(mask, "{}", escapedToken,1) ),ReplaceRecursive(substituted,tokens,i+1,tokenCount))))` |

<details><summary>Prettified<\summary>
```lang-swift
=LAMBDA(
    mask,
    tokens,
    i,
    tokenCount,
    IF(
        i > tokenCount,
        mask,
        LET(
            token,
            INDEX(
                tokens,
                i
            ),
            escapedToken,
            SUBSTITUTE(
                token,
                "}",
                "\}"
            ),
            inIndexedMode,
            ISERROR(
                FIND(
                    "{}",
                    mask,
                    1
                )
            ),
            substituted,
            IF(
                inIndexedMode,
                SUBSTITUTE(
                    mask,
                    "{" & i & "}",
                    escapedToken
                ),
                SUBSTITUTE(
                    mask,
                    "{}",
                    escapedToken,
                    1
                )
            ),
            ReplaceRecursive(
                substituted,
                tokens,
                i + 1,
                tokenCount
            )
        )
    )
)
```
</details>

| Param     | Value                                                                                                                                                                                                                                          |
|-----------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| Name      | printf                                                                                                                                                                                                                                         |
| Scope     | Workbook                                                                                                                                                                                                                                       |
| Comment   | printf(mask: str, tokensArray: {array,} \| range \| str ) -> str \| mask: string to substitute tokens into e.g. "Hello {}, {}" or "Hello {2}, {1}" (1-indexed) \| tokensArray: 1D range or array of tokens, e.g. "world" or {"foo","bar"} or A1:A5 |
| Refers To | `=LAMBDA(mask,tokensArray,LET(r,ROWS(tokensArray), c, COLUMNS(tokensArray), length, MAX(r,c), IF(AND(r>1, c>1), "tokensArray must be 1 dimensional", SUBSTITUTE(ReplaceRecursive(mask, tokensArray, 1, length), "\}","}"))))`                  |

```lang-swift
=LAMBDA(
    mask,
    tokensArray,
    LET(
        r,
        ROWS(
            tokensArray
        ),
        c,
        COLUMNS(
            tokensArray
        ),
        length,
        MAX(
            r,
            c
        ),
        IF(
            AND(
                r > 1,
                c > 1
            ),
            "tokensArray must be 1 dimensional",
            SUBSTITUTE(
                ReplaceRecursive(
                    mask,
                    tokensArray,
                    1,
                    length
                ),
                "\}",
                "}"
            )
        )
    )
)
```

---

There will be improvements to Excel's LAMBDA functions that make this easier to write I'm sure, but this recursive approach is good for now I think.


  [1]: https://stackoverflow.com/a/67858844/6609896
  [2]: https://support.microsoft.com/en-us/office/lambda-function-bd212d27-1cd1-4321-a34a-ccbf254b8b67
  [3]: https://i.stack.imgur.com/cyDQ5.png
  [4]: https://i.stack.imgur.com/Dv8DR.png

19 revs, 2 users 96% · Accepted Answer · 2021-10-24 16:04:57Z

I need this answer for a thing™

Because I can't fall under 30 characters, here's some copy-pasta from the question:

Beware that since the changes to syntax highlighting in December 2010, and the inline hints added in March 2011, no syntax highlighting is applied unless the question's tags or an inline hint enable it. So, to test highlighting here in the sandbox:

The Thing:

I also need an edge case.

I also need an edge case?

I also need an edge case.

I also need an edge case?

I forgot, are quotes continuous?

Line 1 Line 2

Line 3 with preceding angle bracket

Line 4 without preceding angle bracket
line with trailing

Line without trailing line after

Larnu · Accepted Answer · 2021-11-01 16:56:06Z

1

Markdown:

**Id**|**Value**
:-----:|:-----:
7E38AD4A-4C6E-40D9-B805-08C1F4EE14D0|1,370
E48A0A4A-6E6C-41A8-B379-0E14452938C6|1,200

Table:

Value
7E38AD4A-4C6E-40D9-B805-08C1F4EE14D0
E48A0A4A-6E6C-41A8-B379-0E14452938C6

Markdown:

Here is my sample data:
|ID|Name|
|-|-|
|1|Steve|
|2|Jane|

Here is my sample data: |ID|Name| |-|-| |1|Steve| |2|Jane|

answered Nov 1, 2021 at 16:56

community wiki

Larnu

Add a comment |

Jason C · Accepted Answer · 2021-11-09 22:42:45Z

1

🌞 (U+1F31E Sun With Face)
🌙 (U+1F319 Crescent Moon)

answered Nov 9, 2021 at 22:42

community wiki

Jason C

Welcome back Jason! Are you coming to Tavern?
– Shadow Wizard Love Zelda
Nov 10, 2021 at 7:09

Add a comment |

Rob · Accepted Answer · 2021-11-22 20:34:09Z

Use Snippets to display Google Charts.

google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawBackgroundColor);

function drawBackgroundColor() {
  var data = new google.visualization.DataTable();
  data.addColumn('number', 'X');
  data.addColumn('number', 'Dogs');

  data.addRows([
    [0, 0],   [1, 10],  [2, 23],  [3, 17],  [4, 18],  [5, 9],
    [6, 11],  [7, 27],  [8, 33],  [9, 40],  [10, 32], [11, 35],
    [12, 30], [13, 40], [14, 42], [15, 47], [16, 44], [17, 48],
    [18, 52], [19, 54], [20, 42], [21, 55], [22, 56], [23, 57],
    [24, 60], [25, 50], [26, 52], [27, 51], [28, 49], [29, 53],
    [30, 55], [31, 60], [32, 61], [33, 59], [34, 62], [35, 65],
    [36, 62], [37, 58], [38, 55], [39, 61], [40, 64], [41, 65],
    [42, 63], [43, 66], [44, 67], [45, 69], [46, 69], [47, 70],
    [48, 72], [49, 68], [50, 66], [51, 65], [52, 67], [53, 70],
    [54, 71], [55, 72], [56, 73], [57, 75], [58, 70], [59, 68],
    [60, 64], [61, 60], [62, 65], [63, 67], [64, 68], [65, 69],
    [66, 70], [67, 72], [68, 75], [69, 80]
  ]);

  var options = {
    hAxis: {
      title: 'Time'
    },
    vAxis: {
      title: 'Popularity'
    },
    backgroundColor: '#f1f8e9'
  };

  var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
  chart.draw(data, options);
}

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<div id="chart_div"></div>

3 revs · Accepted Answer · 2021-11-24 01:42:49Z

1

Let's put a button:

Link to SVG here.

Self description:

edited Nov 24, 2021 at 1:42

community wiki

3 revs
Someone_who_likes_SE

Add a comment |

Luuklag · Accepted Answer · 2021-12-15 15:29:03Z

1

Just an answer for some comment testing.

answered Dec 15, 2021 at 15:29

community wiki

Luuklag

will this comment do something with hats?
– Luuklag
Dec 15, 2021 at 15:32
And how about this comment then?
– Luuklag
Dec 15, 2021 at 15:39
feel free to test if replying to me gives any hats :)
– Ekadh Singh - Reinstate Monica
Dec 16, 2021 at 19:33
This comment has been edited.
– MrMythical
Feb 8, 2022 at 14:27

Add a comment |

ChrisW · Accepted Answer · 2021-12-19 18:08:56Z

1

Here's another oddity:

A quote.

Another paragraph:

A nested quote.

All is good.

But what about this:

A list item

A quote.

Another paragraph:

A nested quote.

All is good.

answered Dec 19, 2021 at 18:08

community wiki

ChrisW

Add a comment |

Zoe is on strike · Accepted Answer · 2021-12-23 22:44:18Z

1

Render example for a Stacks editor bug report:

One (this point is italic in the editor)

Two

Three

This is italic, and because of a lack of termination (#21), everything after is italic

Regular text

answered Dec 23, 2021 at 22:44

community wiki

Zoe is on strike

Ignore, test comment to see if the comment archive is working
– Zoe is on strike
Mar 29 at 21:53

Add a comment |

Joachim · Accepted Answer · 2022-01-16 20:27:12Z

Formatting of images in tables:

These examples are made to see what methods work for getting the most out of a table's space.

Default behaviour:

The table adapts to the contents of the first cell, and the contents of the adjacent cell(s) are adapted to that of the first.
The second image in the second cell is forced below the first using a <br/> (or two, rather, so the images have a better looking gap between them):

Using the ` `

Using the HTML   entity to fill out the empty space due to the table cells adjusting to the width of the contents of the first cell:

Using ` ` and `<br/>`

Using that same trick but preceded by a <br/> to force that the line of non-breaking spaces below the image (such a line can also be put above the image, logically), to prevent the scrollbar from appearing (thank you @Makyen!):

Using `<img>` entities with custom `width` set

Different aspect ratios behave differently, and there is still a lot of unused space in the table:

Using `<img>` entities with `width` and `height`

It takes a lot more work, but it's indeed doable (the burden of being a perfectionist, I presume). The numbers are guesswork, and the aspect ratios obviously don't correspond with the true dimensions of the images, but it looks good:


Width = 320, height = 640	Width = 370, height = 305 (of both images)

And here's how they all look when the viewport's width changes to something more narrow:

It seems the table with the images in <img> and only their width set wins the beauty contest when viewports of widths < 1265 px are taken into consideration, until the breaking point at 980 px occurs, and the right sidebar is removed. But then it immediately adapts to the viewport's width, so it only looks okay - depending on contents - for a few tens of pixels.

2 revs · Accepted Answer · 2022-02-15 06:17:50Z

1

Spoiler:

Not spoiled!
Spoiled!
Not spoiled!

edited Feb 15, 2022 at 6:17

community wiki

2 revs
Big Brother

Add a comment |

Erwin Brandstetter · Accepted Answer · 2022-04-21 22:41:54Z

Syntax highlighting currently strips HTML tags in `<pre><code>` blocks

(Since Highlight.js is being used instead of Prettify.)

HTML tags work inside <pre> blocks:

SELECT a, not_b FROM tbl WHERE a < b;

Same with <pre><code> blocks - here on meta.SE where automatic code highlighting is deactivated:

SELECT a, not_b FROM tbl WHERE a < b;

The same breaks on SO with automatic code highlighting. Highlight.js strips all tags before adding syntax-highlighting.

I set a language explicitly with  to trigger the same effect here:

HTML tags still work inside <pre> blocks:

SELECT a, not_b FROM tbl WHERE a < b;

But are stripped from <pre><code> blocks:

SELECT a, not_b FROM tbl WHERE a < b;  -- not the intended meaning

While editing, the local preview is rendered differently, and HTML tags seem to work even in <pre><code> blocks. But that's deceiving. Once the draft is saved, syntax-highlighting with Highlight.js kicks in and strips all HTML tags before adding colors - possibly breaking the meaning, especially for <strike>.

This used to work, but is currently broken. See:

2 revs, 2 users 50% · Accepted Answer · 2022-05-01 09:41:52Z

1

Sure hope I don't get answer banned, that would be a real shame.

edited May 1, 2022 at 9:41

community wiki

2 revs, 2 users 50%
Smitop

Add a comment |

My Lovely Sock · Accepted Answer · 2022-05-02 13:52:38Z

1

Testing comment upvote by low rep user.

answered May 2, 2022 at 13:52

community wiki

My Lovely Sock

hey sockboy, just a test
– Luuklag
May 2, 2022 at 13:54

Add a comment |

3 revs, 2 users 70% · Accepted Answer · 2022-05-21 08:52:39Z

1

```
AAA
```
AAA
BBB

BBB
CCC

CCC

edited May 21, 2022 at 8:52

community wiki

3 revs, 2 users 70%
iBug says Reinstate Monica

Add a comment |

Jason C · Accepted Answer · 2022-06-03 01:46:06Z

1

fetch('https://api.stackexchange.com/2.3/sites?pagesize=500&filter=!*UCL0ITv.)X')
  .then(r => r.json())
  .then(r => r.items.forEach(site => {
    let div = document.createElement('div');
    div.classList.add('x');
    div.style = `--imgurl:url(${site.favicon_url})`;
    document.body.appendChild(div);
  }));

.x { background-image: var(--imgurl); }
body { display: grid; grid-template-columns: repeat(5,1fr); }
div { flex: 1; height: 100px; }

it's better fullscreen btw

answered Jun 3, 2022 at 1:46

community wiki

Jason C

Add a comment |

Makyen · Accepted Answer · 2022-07-22 17:29:49Z

This answer is to test the issue in:

"https://meta.stackoverflow.com/questions/419387/stack-overflow-urls-in-double-quotes-in-answers-are-not-replaced-by-the-name-of"
"https://meta.stackoverflow.com/q/345847/3773011"

The above is:

"https://meta.stackoverflow.com/questions/419387/stack-overflow-urls-in-double-quotes-in-answers-are-not-replaced-by-the-name-of"  
"https://meta.stackoverflow.com/q/345847/3773011"

which render in the preview as links with the question title as the link text. In the post as rendered by SE's servers, it shows as a bare URL in double quotes.

The following is:

https://meta.stackoverflow.com/questions/419387/stack-overflow-urls-in-double-quotes-in-answers-are-not-replaced-by-the-name-of  
https://meta.stackoverflow.com/q/345847/3773011

Stack Overflow URLs in double quotes in answers are not replaced by the name of the question
Editor preview disagrees on link title

which also renders in both the preview and server rendered version as the question titles.

Cristobal Arroyo · Accepted Answer · 2022-08-26 01:38:33Z

1

html <h1>Heading1</h1> <details>Some details</details>

answered Aug 26, 2022 at 1:38

community wiki

Cristobal Arroyo

html <html><h1>Sample comment</h1> <details>This comment comes from python stackapi</details><html>
– Cristobal Arroyo
Aug 26, 2022 at 2:15

Add a comment |

MakTest2 · Accepted Answer · 2022-09-04 23:11:23Z

1

This is just an answer in order to test some site functionality with a low reputation account.

answered Sep 4, 2022 at 23:11

community wiki

MakTest2

Add a comment |

Dharman · Accepted Answer · 2022-09-16 12:41:10Z

1

I am also testing something. Does this work?

answered Sep 16, 2022 at 12:41

community wiki

Dharman

What did you test?
– Shadow Wizard Love Zelda
Sep 16, 2022 at 12:53
@ShadowTheKidWizard I wanted to see if there's a message going to show up when submitting the answer.
– Dharman
Sep 16, 2022 at 13:01
What message were you expecting to show?
– Shadow Wizard Love Zelda
Sep 16, 2022 at 13:12
A warning of some kind about low-length or poor quality.
– Dharman
Sep 16, 2022 at 13:12
Oh, I think MSE and meta sites in general don't have quality filter, so that people can ask about such things or test, not sure. Didn't find official source, will keep looking.
– Shadow Wizard Love Zelda
Sep 16, 2022 at 13:15

Add a comment |

4 revs · Accepted Answer · 2022-09-17 12:15:42Z

1

This is a test answer for getting a view of revisions

edited Sep 17, 2022 at 12:15

community wiki

4 revs
Journeyman Geek

Effective at creating a VLQ Review too: meta.stackexchange.com/review/low-quality-posts/83905
– Rob
Sep 17, 2022 at 12:23
2

amusingly - this was a pain in the rear to get what I needed :D
– Journeyman Geek
Sep 17, 2022 at 12:38

Add a comment |

Stack Exchange Network

Formatting Sandbox

290 Answers 290

Heading

`var i = document.getElementsByTagName('p')[0]; var j=0; for (j=0; j<=1000; j++) { i.innerHTML+=" "+j; }`

`*{word-break:break-word;}`

`<p>hello world!<br></p>`

Formatting of images in tables:

Default behaviour:

Using the ` `

Using ` ` and `<br/>`

Using `<img>` entities with custom `width` set

Using `<img>` entities with `width` and `height`

Syntax highlighting currently strips HTML tags in `<pre><code>` blocks

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged
discussion
support
markdown
testing
sandbox
.

Linked

Hot Network Questions

Formatting Sandbox

290 Answers 290

Heading

var i = document.getElementsByTagName('p')[0]; var j=0; for (j=0; j<=1000; j++) { i.innerHTML+="&nbsp;"+j; } *{word-break:break-word;} <p>hello world!<br></p>

Formatting of images in tables:

Default behaviour:

Using the &nbsp;

Using &nbsp; and <br/>

Using <img> entities with custom width set

Using <img> entities with width and height

Syntax highlighting currently strips HTML tags in <pre><code> blocks

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged discussionsupportmarkdowntestingsandbox.

Linked

Related

Hot Network Questions

`var i = document.getElementsByTagName('p')[0]; var j=0; for (j=0; j<=1000; j++) { i.innerHTML+=" "+j; }`

`*{word-break:break-word;}`

`<p>hello world!<br></p>`

Using the ` `

Using ` ` and `<br/>`

Using `<img>` entities with custom `width` set

Using `<img>` entities with `width` and `height`

Syntax highlighting currently strips HTML tags in `<pre><code>` blocks

Not the answer you're looking for? Browse other questions tagged
discussion
support
markdown
testing
sandbox
.