quarto-dev / quarto-dev/quarto-cli

Using callout block at beginning of website post renders with skewed positioning

Open
#11,029 6 comments 0 reactions 1 assignee View on GitHub

@cscheid is already working on this.

Since Oct 11, 2024.

bug listings themes
Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 9h
Merged PRs (30d)
41

Description

Bug description

If a callout block is the first bit of content for a website post, then the resulting render of that post has skewed positioning, relative to other posts in the website. Here's a screencap demonstrating this. The October 4th post begins with a callout block and you can see the resulting render positioning.

Screencap of website render showing post with callout block as initial content skewed, relative to other posts.

Here's link to code from that post:

https://github.com/RobertsLab/sams-notebook/blob/adb98eb1258a21a208457b7262082ddadfa7831a/posts/2024/2024-10-04-FastQ-QC---A.pulchra-RNA-seq-from-Azenta-Project-30-1047560508/index.qmd

Steps to reproduce

Step to reproduce: Create a website post where the first text in the body is a callout block.

Repo: https://github.com/RobertsLab/sams-notebook

Reproducible example:

---
title: "Callout at beginning results in skewed render"
format: html

---

::: callout-note
This notebook entry is knitted from [`urol-e5/timeseries_molecular/D-Apul/code/00.00-D-Apul-RNAseq-reads-FastQC-MultiQC.Rmd`](https://github.com/urol-e5/timeseries_molecular/blob/b7a80beee932d773e3c61eb3e7c7f2aede5020d6/D-Apul/code/00.00-D-Apul-RNAseq-reads-FastQC-MultiQC.Rmd) (GitHub), commit `b7a80be`.
:::

This Rmd file will download raw RNA-seq FastQs for *A.pulchra* and evaluate them using [FastQC](https://github.com/s-andrews/FastQC) and [MultiQC](https://multiqc.info/).

# 1 Create a Bash variables file

This allows usage of Bash variables across R Markdown chunks.
Expected behavior

I expect the post to render and be aligned with other posts.

Actual behavior

The render post is skewed, relative to the positions of the other posts.

Your environment

IDE: VSCode
OS: Kubuntu 22.04LTS

Quarto check output
$quarto check

Quarto 1.4.554
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.1.11: OK
      Dart Sass version 1.69.5: OK
      Deno version 1.37.2: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 1.4.554
      Path: /opt/quarto/bin

[✓] Checking tools....................OK
      TinyTeX: (not installed)
      Chromium: (not installed)

[✓] Checking LaTeX....................OK
      Using: Installation From Path
      Path: /usr/bin
      Version: 2021

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
      Version: 3.10.12
      Path: /usr/bin/python3
      Jupyter: (None)

      Jupyter is not available in this Python installation.
      Install with python3 -m pip install jupyter

[✓] Checking R installation...........OK
      Version: 4.4.1
      Path: /usr/lib/R
      LibPaths:
        - /home/sam/R/x86_64-pc-linux-gnu-library/4.4
        - /usr/local/lib/R/site-library
        - /usr/lib/R/site-library
        - /usr/lib/R/library
      knitr: 1.47
      rmarkdown: 2.27

[✓] Checking Knitr engine render......OK

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.