I am converting my project element library from xpath to CSS. Some xpath expression written using 'following' and 'preceding' method. Like below.

//div[@id='dashboard_right_now']/following::a[contains(@href, 'edit')][text() = 'Posts']

Now I want to convert same expression with equivalent CSS. I searched google around and found "+" operator used as 'following' in CSS. But firepath tools gives "no node matched" error.

div#dashboard_right_now>div.inside>div>p + a[href*='edit']

Any suggestion on how to incorporate 'following' and 'preceding' methods in css selector. Thanks

  • css does not allow to navigate back in dom tree, hence there is no corresponding method for preceding in css. On another note, expression looks very long and prone to errors when application changes.
    – Tarun
    Jul 28, 2016 at 10:13
  • Understand, expression bit log. So how about 'following' method? this method also not allowed in CSS? Jul 28, 2016 at 10:21
  • Have you tried to change the selectors format, to see if you can get the elements without using the following/preceding? please post html snippets if possible for each case for a more particular answer.
    – lauda
    Aug 1, 2016 at 11:57

1 Answer 1


Please consider the following advice:


  • css selector currently does not support traverse backwards, it may be supported in the future.


  • Element E1 following some sibling E2, css = E2+E1
  • Element E1 following sibling E2 with one element in between, css = E2+ * + E1
  • Some element immediately following E, css = E + *

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.