# Rising scroll threshold in code blocks (or complete unfolding)

**URL:** https://meta.discourse.org/t/rising-scroll-threshold-in-code-blocks-or-complete-unfolding/34260
**Category:** UX
**Created:** [October 8, 2015, 9:45am UTC](https://meta.discourse.org/t/rising-scroll-threshold-in-code-blocks-or-complete-unfolding/34260 "2015-10-08T09:45:51Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![firegurafiku](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/firegurafiku/32/116849_2.png) [@firegurafiku](https://meta.discourse.org/u/firegurafiku)
#### Post date: [October 8, 2015, 9:45am UTC](https://meta.discourse.org/t/rising-scroll-threshold-in-code-blocks-or-complete-unfolding/34260/1 "2015-10-08T09:45:51Z")

</div>

When you insert a Markdown code block (` ````) into your message, it receives automatic vertical scrollbar if its content is long enough. But I don’t mind having long listings in messages and want to display code inline until it reaches, say, 200 lines long. Is there a way to control this threshold?

Alternatively, if no such threshold can be set, is it possible to completely unroll the listing regardless its length? I tried setting `display: table` to code tag, it worked, but block width got shrink to content width too. So I tried setting `width: 100%`, but that resulted in having horizontal scrollbar emerged. I’m not that skilled in CSS, could anybody please help me?

---

<div class="post-metadata">

### Author: ![cpradio](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cpradio/32/4970_2.png) [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [October 8, 2015, 11:48am UTC](https://meta.discourse.org/t/rising-scroll-threshold-in-code-blocks-or-complete-unfolding/34260/2 "2015-10-08T11:48:27Z")

</div>

You want to adjust and/or remove the max-height attribute of `pre code`

So in your Admin \> Customize \> CSS/HTML \> CSS area, put

```plaintext
pre code {
  max-height: 800px;
}

```

You can change 800px to any number really, it simply implies when the code block reaches that amount of space, start showing the scrollbar.

---

<div class="post-metadata">

### Author: ![firegurafiku](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/firegurafiku/32/116849_2.png) [@firegurafiku](https://meta.discourse.org/u/firegurafiku)
#### Post date: [October 8, 2015, 12:16pm UTC](https://meta.discourse.org/t/rising-scroll-threshold-in-code-blocks-or-complete-unfolding/34260/3 "2015-10-08T12:16:14Z")

</div>

Thanks! That works like a charm and is exactly that I wanted.

---

<div class="post-metadata">

### Author: ![simonmic](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simonmic/32/367698_2.png) [@simonmic](https://meta.discourse.org/u/simonmic)
#### Post date: [April 1, 2024, 9:27pm UTC](https://meta.discourse.org/t/rising-scroll-threshold-in-code-blocks-or-complete-unfolding/34260/4 "2024-04-01T21:27:35Z")

</div>

Or - scattershot, but working so far:

```plaintext
pre code {max-height:none;}
pre {max-height:none;}

```

My outer pre has a max height of 2000px, so needed adjusting also.
