CSS selectors no longer respect first-of-type and last-of-type

[p5v]

I am trying to format the style of my PDF export using a custom CSS snippet. However, I was negatively surprised when I saw that my export no longer works as it was supposed to. Looks like first-of-type and last-of-type selector modifiers are no longer treated properly by Obsidian.

To prove this, I created a brand new vault with no community plugins and a single note. I added the following basic global styles for testing:

h1:first-of-type {
  border: 1px solid red;
}

h1:not(:first-of-type) {
  border: 1px solid yellow;
}

h1 {
  border: 1px solid green;
}

h1:last-of-type {
  border: 1px solid blue;
}

However, as you can see, none of what I expected actually happened. It looks almost as if Obsidian now loads each heading section on the fly, causign every heading to look like it is both the first and the last one in the page.

Could anyone else confirm that? Is there a way to work aroudn it? Many thanks in advance for your answers.

[ariehen]

Using the exact CSS above, I see this same. Obsidian v1.6.7 (v1.6.5 installer).

Source mode | Reading view

You say this worked in the past – can you pin it down to a version update and/or an installer change?

[holroy]

Have this ever worked in Obsidian? These two selectors select either the first or last occurrence of a list of elements at the same level. Within Obsidian each markdown heading is within a div element which makes the div’s appear at the same level, not the header element which is a child element.

On a related note; The same reasoning is why it was a game changer when we could use the has() selector since we then could target the parent div, through checking its child element(s).

[liam]

I can confirm that the DOM did change recently for PDF exports. Each section is now wrapped in a <div> element. Because first-of-type and last-of-type only checks elements on the same level, these queries will no longer work, unfortunately. You will need to find a new way to query for the elements you are after.

The change was added as part of changes that improve support for exporting right-to-left text.