Select elements anywhere on the page if a specific selector exists.
In this example if the hero section is present, hide the logo in the navbar and change the flex box alignment.
body:has(.home-page-hero) nav .logo {
display: none;
}
body:has(.home-page-hero) .sub-page nav {
justify-content: flex-end;
}
Syntax is a Podcast about Web Development. Started by Wes and Scott in 2017, Syntax has published 741 podcast episodes on full-stack web development, covering JavaScript Server + Client, the latest Frameworks, HTML, CSS, databases, deployment environments, and a whole lot more! You should listen! It's pretty good.