Footer text vertical alignment not centered

[ravimakhijapi]

Bug description

Not all of the footer text is centered vertically. In particular, the horizontally centered footer text (using footer:center: in the yaml) seems to be raised in the footer.

Steps to reproduce

Create a Quarto website with a footer like below:

  page-footer:
    border: true
    left: "Left Footer"
    center: "Center Footer"
    right:
    - text: "Right Footer 1"
    - text: "Right Footer 2"

The center footer is showing up above the vertical center position.

Quarto version

Quarto v1.4.555

Note: the issue was not present in Quarto v1.3.298..

[cscheid]

I can't seem to repro this:

Can you provide:

• a screenshot of what you're seeing,
• a link to a repository that we can use to recreate your example

[ravimakhijapi]

Thanks for the quick response! Quick correction: all of the footer text seemed to be raised by default (e.g. not just the horizontally center text), though the temp fix we used for the center text was slightly different.

Here is a temp repo for reproducing the issue: https://github.com/datascijedi/temp--quarto-footer-issue. You can uncomment the css in styles.css to see the temporary fix we are using.
Edit: (Removed the temp repo after this issue was closed).

Screenshot of issue:

Screenshot of issue addressed with temp fix:

[mcanouil]

Isn't it the default Bootstrap for nav-footer?

.nav-footer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    text-align: center;
    padding-top: .5rem;
    padding-bottom: .5rem;
    background-color: #333
}

Edit: it is also set by Quarto:

• quarto-cli/src/resources/projects/website/navigation/quarto-nav.scss

  Line 811 in f1ab12b

  align-items: baseline;

Changing align-items: baseline to align-items: center should do it. (as suggested in your stylesheet)

[mcanouil]

Regarding the other suggested change:

.nav-footer-center {
    min-height: 0px;
} 

I don't think that is the right fix here. See the original CSS:

• quarto-cli/src/resources/projects/website/navigation/quarto-nav.scss

  Lines 905 to 919 in f1ab12b

  	.nav-footer-center {
  	@include media-breakpoint-up(md) {
  	flex: 1 1 0px;
  	}
  	text-align: center;
  	min-height: 3em;
  	.footer-items {
  	justify-content: center;
  	}
  	@include media-breakpoint-down(md) {
  	margin-bottom: 1em;
  	flex: 100%;
  	}
  	}

[cscheid]

Is this a Future bug or is it even a bug to begin with? It's a change in behavior from 1.3, but we (for example) updated bootstrap version etc.

[mcanouil]

To me, it's more of a design decision.
Probably better / more accurate to label this as enhancement New feature or request