Pseudo-class first and last child

I Need Help
1

Hello,

The addition of pseudo-class before and after in Blocs 5 is really great!
Is there anything similar for first::child and last::child ?

I’d like to use it because I add a caracter (slash) to separate items in main menu and, of course, I don’t want the slash before the first menu item.

I tried various CSS addition in Code Editor, the last being:

li.nav-item::before:first-child {
  content:"";
}

or display:none
none are working.
Maybe I don’t target the correct class.

See it live here.

Any idea would be helpful. Thank you.

2

I’m only on my phone, but…

The :first-child works on the children of the parent. So you need to consider than when you target, eg you target the child.

Also you will find the class is the other way around. :first-child before the ::before

:first-child is a pseudo class, where ::before is a pseudo element.

3

Thanks for the tip @PeteSharp

You are right. After few trials it works :sweat_smile:

Here we go: .nav-item:first-child::before

1 Like
4

Since I am not in the same class as many as you are. I had to look up what a Pseudo-class is. After watching the 3 minutes video it made me more thankful for the way Blocs works.

I have a lot to learn, but I excited about the process. If anyone else has some videos, links or books please reply back when you get some time.

5

If you want to learn and take things off the rails, download Visual Basic and start creating by hand. Watching videos is ok, but you will learn and understand more by doing.

This won’t be the forum for support for that though.

6

Very cool! :slight_smile: Is this what you use? Visual Studio CodeAplle Logo Did you setup any extensions?
I play with Sublime, but this you shared looks good.

7

I have extensions for my setup.

I use Sublime everyday too. (It’s my go to for Blocs stuff)

1 Like