Asserts that a named subject element is rendered below one or more other named elements, using absolute page coordinates: the assertion passes when the top edge of the subject is at or below the bottom edge of every target. It is the mirror of the above assertion, and is often the more natural phrasing when the subject is a footer, results list, or anything that follows other content in the page flow.
All names are resolved through the selector registries (CSS first, then XPath), so register them beforehand with Given I define css selectors:, a single When I add ... css selector step, or a selector JSON file. Both the subject and the target side accept comma or and separated lists; every subject is checked against every target and all failing pairs are reported together. Elements are scrolled into view before measuring, and a hidden element fails with an explicit bounding-box message.
Accepted phrasings
Then I see <subject> below <others>
Then we see <subject> below <others>
Then see <subject> below <others>Examples
Then I see footer below header
Then I see content below nav
Then I see footer below header, nav and content
Then I see results below searchIn a real scenario
Scenario: The footer stays at the bottom of every landmark
Given I define css selectors:
| site header | header.site-header |
| main content | main |
| footer | footer |
Given I am an anonymous user
When I go to the homepage
Then I see visible site header, main content and footer
And I see footer below site header, main content
And I see main content below site header