Search code examples
seleniumbrowsergoogle-chrome-devtoolsdeveloper-toolsselenium-chromedriver

HTML code - how to find out absolute position on the page?


Is there any browser engine or plugin which would give user information about position of given HTML element ? I want to know where is element located e.g. left corner or center of the page.

It should not be a huge problem as Firefox and Chrome marks you elements within page as you go through html code in Developer Tools > "Element tab".

Example of highlighted element : https://i.sstatic.net/Eu31L.jpg we see that selected element is currently in the centre of the screen - how to get this information programatically ?


Solution

  • Selenium-webdriver can give you information about any DOM element you want:

    d = Selenium::WebDriver.for :chrome
    d.get "http://www.google.com"
    elem = d.find_element(:name, "btnI")
    elem.location
    => #<struct Selenium::WebDriver::Point x=532, y=356>