### Discussed in https://github.com/quarto-dev/quarto-cli/discussions/1904

<div type='discussions-op-text'>

<sup>Originally posted by **RegalPlatypus** August 15, 2022</sup>
When generating an HTML report I like to display graphs side by side using the ```layout-ncol``` argument. This often requires me to increased the column width using ```column: page``` or similar. When you scroll to that point, the toc hides ([as it should](https://quarto.org/docs/output-formats/html-basics.html#table-of-contents)). 

However the toc behavior is usually different once the autohide has been activated. In the given example (viewed in Chrome) the toc immediately re-hides as soon as a user scrolls up or down on the page. The title of the first chapter containing the first ```column: page``` argument remains forever blue as though it is the current section being viewed, regardless of whether or not that is true. In my actual report, all toc levels >1 collapse and will never expand again so that the ```toc-depth``` effectively becomes 1.

*Note:* For the example below I had to remove the ticks before and after the plot code chunk. It didn't like having a code chunk within a code chunk.

```
---
title: "Example Report"
author: "John Smith"
date: "1/1/2023"
format:
  html: 
    toc: true
    toc-location: left
    anchor-sections: false
    number-sections: true
    smooth-scroll: true
    self-contained: true
    output-file: "example.html"
---

# First Chapter

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

# Second Chapter

## First Sub.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Consectetur a erat nam at lectus urna duis. Ultricies tristique nulla aliquet enim tortor at auctor. Sapien nec sagittis aliquam malesuada bibendum. Nisi scelerisque eu ultrices vitae.

## Second Sub.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Tellus elementum sagittis vitae et leo duis ut. Pharetra magna ac placerat vestibulum. Ac feugiat sed lectus vestibulum mattis ullamcorper. Mattis aliquam faucibus purus in massa. Lacus laoreet non curabitur gravida. Ac tortor dignissim convallis aenean et tortor at risus viverra.

```{r}
#| label: fig-demo
#| fig-cap: "&nbsp;"
#| fig-subcap: 
#| - "&nbsp;"
#| - "&nbsp;"
#| layout-ncol: 2
#| column: page
#| echo: false

plot(x = 1, y = 1)
plot(x = 2, y = 2)```



## Third Sub.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Aliquam vestibulum morbi blandit cursus risus at ultrices mi. Elit at imperdiet dui accumsan sit.

# Third Chapter

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Tristique sollicitudin nibh sit amet commodo. Sit amet dictum sit amet justo donec enim diam. Tortor condimentum lacinia quis vel eros. Mi eget mauris pharetra et ultrices neque ornare aenean euismod. Pharetra sit amet aliquam id. Sed blandit libero volutpat sed cras ornare arcu. Elit pellentesque habitant morbi tristique. Et tortor consequat id porta nibh venenatis. Quis auctor elit sed vulputate mi. Enim neque volutpat ac tincidunt vitae semper quis lectus. Purus non enim praesent elementum facilisis leo. Dui faucibus in ornare quam. Euismod in pellentesque massa placerat duis ultricies lacus. Nunc aliquet bibendum enim facilisis gravida neque.

Posuere ac ut consequat semper. Ipsum dolor sit amet consectetur adipiscing elit pellentesque habitant morbi. Pretium quam vulputate dignissim suspendisse in est ante. Egestas pretium aenean pharetra magna ac placerat vestibulum. Sed blandit libero volutpat sed. Lectus urna duis convallis convallis tellus id interdum. Egestas quis ipsum suspendisse ultrices gravida dictum fusce. Luctus venenatis lectus magna fringilla. Cras ornare arcu dui vivamus. In iaculis nunc sed augue lacus. Non diam phasellus vestibulum lorem sed risus ultricies tristique nulla. Sit amet commodo nulla facilisi nullam vehicula ipsum a arcu. Urna et pharetra pharetra massa massa ultricies mi quis. Egestas purus viverra accumsan in nisl nisi scelerisque. Ipsum a arcu cursus vitae congue mauris rhoncus aenean. Vitae aliquet nec ullamcorper sit amet risus. Bibendum arcu vitae elementum curabitur vitae nunc sed.

# Fourth Chapter

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Iaculis at erat pellentesque adipiscing commodo. Sed egestas egestas fringilla phasellus faucibus scelerisque. Egestas sed sed risus pretium quam vulputate dignissim. Imperdiet proin fermentum leo vel orci porta non pulvinar. Amet luctus venenatis lectus magna. Non odio euismod lacinia at quis risus sed. Ipsum faucibus vitae aliquet nec ullamcorper sit. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. In ante metus dictum at tempor commodo ullamcorper a. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus. Vehicula ipsum a arcu cursus vitae. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit sed.

Ante in nibh mauris cursus mattis. Enim nulla aliquet porttitor lacus luctus accumsan tortor posuere ac. Nisl nunc mi ipsum faucibus vitae aliquet nec. Vestibulum mattis ullamcorper velit sed. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Diam volutpat commodo sed egestas egestas fringilla phasellus. Mattis vulputate enim nulla aliquet porttitor lacus luctus. Massa tincidunt nunc pulvinar sapien et ligula. Imperdiet massa tincidunt nunc pulvinar sapien et ligula. Magna ac placerat vestibulum lectus mauris ultrices eros. Massa vitae tortor condimentum lacinia quis vel eros. In est ante in nibh mauris cursus mattis molestie a. Diam sollicitudin tempor id eu nisl. Lorem ipsum dolor sit amet consectetur adipiscing. Suspendisse potenti nullam ac tortor vitae purus faucibus.

Ipsum dolor sit amet consectetur. Iaculis at erat pellentesque adipiscing commodo elit at. Ac auctor augue mauris augue. Condimentum vitae sapien pellentesque habitant morbi. Gravida quis blandit turpis cursus in hac. Maecenas volutpat blandit aliquam etiam erat velit scelerisque. Sollicitudin nibh sit amet commodo nulla facilisi. Adipiscing diam donec adipiscing tristique risus nec feugiat in fermentum. Aliquam eleifend mi in nulla posuere sollicitudin aliquam ultrices sagittis. Sed risus ultricies tristique nulla aliquet enim tortor at auctor. Id faucibus nisl tincidunt eget nullam. Ipsum dolor sit amet consectetur. Egestas sed sed risus pretium quam vulputate dignissim suspendisse. Quis vel eros donec ac odio tempor orci. Nibh sed pulvinar proin gravida hendrerit.
```
</div>
dragonstyle
2022-08-15T20:46:00Z
RegalPlatypus
v1.1
closed
Strange TOC behavior after autohiding.
https://github.com/quarto-dev/quarto-cli/issues/1905