:first-of-type / :last-of-type – not isolating individual element

[Toby39]

Hi guys,
I am an old Studiopress customer and I have a question about modifying the Genesis-Sample theme. I have already tried to modify the CSS in what I thought was the correct way, but it doesn't seem to work, so I though this might be something unique to Genesis.

I am trying to modify the ".nav-primary .genesis-nav-menu a {" to add an exception for the FIRST menu item, like so ".nav-primary .genesis-nav-menu a:first-of-type {"

.nav-primary .genesis-nav-menu a {
margin-left: 30px;
}
.nav-primary .genesis-nav-menu a:first-of-type {
margin-left: 0px;
}

However, I notice that whatever I set for ":first-of-type" ends up applying to ALL the menu items, not just the first.

I have tried to apply this method to various other selectors, all to no avail.

Any help would be much appreciated. Thank you

_ _ _ _ _ _ _ _ _

URL: https://www.businesslabs.uk/wp-login.php
Username: studiopress
Password: KWcXBTQB&Tm*dNxc%G0iKD1v

https://www.businesslabs.uk/wp-login.php

[Brad Dalton]

Here's 3 ways to use pseudo-classes to style the 1st nav menu item in Genesis child themes.

---

Tutorials for StudioPress Themes & WooCommerce.

[Toby39]

Hey, thanks Brad.

.nav-primary .genesis-nav-menu > li:first-of-type ... worked a charm.

[Author]

Posts