Quarto Revealjs: Author not centering on title slide despite CSS rules
04:01 12 Dec 2025

I'm creating a Quarto Revealjs presentation and cannot get the author information to center on the title slide, despite having text-align: center; in my CSS. The title and subtitle center correctly, but the author remains left-aligned.

Minimal Reproducible Example

QMD file (presentation.qmd):

---
title: "Data Visualization"
subtitle: "for Genomics and Biological Sciences"
author: "Dr. Loukas Theodosiou // December 15th 2025"
title-slide-attributes:
    data-background-color: "#E8F5F1"
format:
  revealjs:
    theme: slides.scss
    footer: '**GraphAI** // Consultation in Genomics Data Visualization'
    transition: fade
    progress: true
    multiplex: false
    preview-links: true
    scrollable: false
    hide-inactive-cursor: true
    highlight-style: printing
    pause: true
    embed-resources: false
editor: source
---

# Why do we need data visualisations?

Content here...

SCSS file (slides.scss):

/*-- scss:defaults --*/

@import url('https://fonts.googleapis.com/css2?family=Asap:ital,wdth,wght@0,87.5,400;0,87.5,500;0,87.5,600;0,87.5,700;0,87.5,800;0,87.5,900;0,100,400;0,100,500;0,100,600;0,100,700;0,100,800;0,100,900;1,87.5,400;1,87.5,500;1,87.5,600;1,87.5,700;1,87.5,800;1,87.5,900;1,100,400;1,100,500;1,100,600;1,100,700;1,100,800;1,100,900&family=Literata:ital,opsz,wght@0,7..72,400;0,7..72,500;0,7..72,600;0,7..72,700;0,7..72,800;0,7..72,900;1,7..72,400;1,7..72,500;1,7..72,600;1,7..72,700;1,7..72,800;1,7..72,900&family=Spline+Sans+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Spline+Sans:wght@400;500;600;700&display=swap');

$font-family-sans-serif: 'Asap', 'Asap Condensed', 'Spline Sans', 'Tahoma', 'Arial', sans-serif;
$font-family-serif: 'Literata', 'Bodoni MT', 'Bodoni 72', 'Georgia', 'Times', serif;

/*-- scss:rules --*/

/* Title - CENTERS CORRECTLY */
h1.title {
  font-family: 'Literata', 'Bodoni MT', 'Bodoni 72', 'Georgia', 'Times', serif;
  font-size: 1.7em;
  font-style: italic;
  font-weight: 800;
  color: #28A87D;
  line-height: 1.07;
  text-align: center;
  margin-bottom: .4em;
}

/* Subtitle - CENTERS CORRECTLY */
p.subtitle {
  color: #606060;
  font-weight: 600;
  font-style: italic;
  line-height: .97;
  text-align: center;
}

/* Author - DOES NOT CENTER */
.quarto-title-author {
  font-size: .8em;
  font-weight: 600;
  color: #606060;
  font-style: italic;
  margin-top: 1.5em;
  text-align: center;  /* <-- This doesn't work! */
}

.backgrounds .title-slide {
  background-color: #c9f2e4;
}

What I've Tried

  1. Adding text-align: center; to .quarto-title-author

  2. Adding !important flag: text-align: center !important;

  3. Targeting multiple possible classes: .quarto-title-author, .quarto-title-authors, .quarto-title-author-name

  4. Adding width: 100%; display: block; to the CSS rule

  5. Wrapping the author in a

    with inline styles in the YAML (works but defeats the purpose of using SCSS)

Expected vs Actual Behavior

Expected: The author line should be centered on the title slide, just like the title and subtitle.

Actual: The author remains left-aligned despite the CSS rule.

Questions

  1. What is the correct CSS selector for centering the author in Quarto Revealjs?

  2. Is there a Quarto-specific way to control title slide layout that I'm missing?

  3. Could the inline HTML ( tag) in the author field be interfering with the CSS?

Environment

  • Quarto version: 1.4+ (tested on latest)

  • Format: revealjs

  • Browser: Chrome/Firefox (issue occurs in both)


css sass reveal.js quatro