How to get full CSS selector path?

I need to get full CSS selector path for element like this

html > body > div > div:eq(1) > div > div:eq(4) > div > div:eq(1) > div > div:eq(0) > p:eq(21)

but what I get currently from Chrome for example is something like this

#post_1 > div:nth-child(2) > div.topic-body.clearfix.highlighted > div.topic-meta-data > div.names.trigger-user-card > span > a

Any tool to get the full path ?

You could use copy full Xpath from Chrome devtools and you would get something like this.

/*
/html/body/section/div/div[2]/div[2]/div[2]/div[3]/div[3]/section/div[1]/div[2]/div/div/article/div[1]/div[2]/div[2]/div/p[3]
*/

Which you could convert into CSS like this.


html > body > section > div > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(3) > section > div:nth-of-type(1) > div:nth-of-type(2) > div > div > article > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div > p:nth-of-type(3){
  background:red!important;
}

I just tried it on this page.

1 Like

Thanks alot @PaulOB

:tulip:

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.