R Markdown浮动目录：水平滚动时内容不重叠的实现方法

当使用toc_float: true生成左侧悬浮目录时，宽内容（如多列的DT::datatable()）水平滚动会与目录重叠，可通过自定义CSS调整主内容区域边距解决，无需缩小数据表：

解决方案：添加自定义CSS #

在R Markdown文档中插入以下CSS代码，为主内容容器设置足够的左侧内边距，确保内容始终避开浮动目录的位置：

<style>
/* 为主内容容器设置左侧内边距，避开浮动目录 */
.main-container {
  padding-left: 280px; /* 数值略大于默认浮动目录宽度（约260px） */
}

/* 适配移动端，避免小屏幕上边距过大 */
@media (max-width: 768px) {
  .main-container {
    padding-left: 15px; /* 恢复移动端默认边距 */
  }
}
</style>

完整示例代码 #

将上述CSS插入到YAML头部之后即可：

---
title: "rmd floating toc test"
output:
  html_document:
    toc: true
    toc_float: true
---

<style>
.main-container {
  padding-left: 280px;
}

@media (max-width: 768px) {
  .main-container {
    padding-left: 15px;
  }
}
</style>

## level 2 title

bla bla bla

### level 3 title

bla bla bla

```{r, echo=FALSE}
Sys.setenv(LANG="en")
library(tidyr)
library(DT)
DT::datatable(billboard)

## 原理说明
默认情况下，启用`toc_float: true`后，浮动目录采用固定定位（`position: fixed`）悬浮在左侧，但主内容容器的左侧内边距未调整，导致宽内容滚动时会覆盖目录区域。通过增大主内容容器的左侧内边距，让内容整体右移，即可避免重叠；同时添加媒体查询，确保移动端显示正常。

内容的提问来源于stack exchange，提问作者degeso