如何让Quarto网格布局左上角div容器的文本左上对齐？

问题核心在于Quarto的网格布局默认会将容器内容垂直居中，而HTML的vertical-align: top样式在PDF输出（依赖LaTeX渲染）中无法生效，需要通过Quarto原生布局属性或LaTeX命令调整。

方案1：使用Quarto原生布局对齐属性 #

直接给布局块添加layout-valign参数，可全局或单独指定容器的垂直对齐方式：

修改后的完整代码：

---
format: 
  pdf:
    pdf-engine: xelatex
    documentclass: article
    geometry:
      - left=1cm
      - right=1cm
      - top=2cm
      - bottom=1cm
    mainfont: Open Sans
    include-in-header: 
      text: |
        \usepackage{fancyhdr}
        \pagestyle{fancy}
        \usepackage{tikz}
        \usepackage{lipsum}
        \usepackage{etoolbox}
        \patchcmd{\chapter}{\thispagestyle{plain}}{\thispagestyle{fancy}}{}{}
        
        \definecolor{gmitblue}{RGB}{0,32,96}
        
        \usetikzlibrary{calc}
        \renewcommand{\headrulewidth}{0pt}
        
        \fancyhf{}
        \fancyhead[C]{%
        \begin{tikzpicture}[overlay, remember picture]%
            \fill[gmitblue] (current page.north west) rectangle ($(current page.north east)+(0,-0.75in)$);
            \node[anchor=north west, text=white, font=\Large\scshape, minimum size=0.75in, inner xsep=5mm] at (current page.north west) {Report title};
            \node[anchor=north east, minimum size=0.75in, inner xsep=5mm] at (current page.north east) {\includegraphics[height=0.8cm,keepaspectratio]{generic_logo.png}};
        \end{tikzpicture}
        }
        
        \setlength{\headheight}{12pt}
---

::: {layout-nrow="3" layout-valign="top"}

::: {layout-valign="top"}
## Executive Summary
 * Bullet 1
 * Bullet 2
 * Bullet 3
 * Bullet 4
 * Bullet 5
:::

![](some_plot.png){width="3.33in"}

![](some_plot.png){width="3.33in"}

![](some_plot.png){width="3.33in"}

![](some_plot.png){width="3.33in"}

![](some_plot.png){width="3.33in"}
:::

• 外层布局块添加layout-valign="top"，会让所有网格容器内容默认顶部对齐
• 若只需单独调整左上角容器，仅给该子块添加{layout-valign="top"}即可

方案2：用LaTeX命令强制顶部对齐 #

如果方案1不生效，可直接在左上角容器内嵌入LaTeX的\vtop命令，强制内容从顶部开始排版：

---
# 头部配置保持不变
---

::: {layout-nrow="3"}

<div>
\vtop{
## Executive Summary
 * Bullet 1
 * Bullet 2
 * Bullet 3
 * Bullet 4
 * Bullet 5
}
</div>

# 其余图片代码保持不变
:::

LaTeX的\vtop会覆盖默认的垂直居中行为，确保内容从容器顶部开始排列。

补充说明 #

Quarto的PDF输出基于LaTeX编译，常规HTML/CSS样式无法直接作用于LaTeX渲染环境，必须使用Quarto提供的布局参数或原生LaTeX命令来调整排版规则。

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