# getBoundingClientRect method

The `getBoundingClientRect` method contains an element coordinate object. Coordinates are calculated relative to the visible part of the page without scrolling (relative to the window). That is, as with the `position` property in the value `fixed`.

The returned object contains the following properties: `left`, `top`, `right`, `bottom`, `width`, `height`. It's worth noting that these properties have nothing to do with CSS properties. They contain the distances to the corresponding sides of the element. For `left/right` - from the left border of the visible area of a page, and for `top/bottom` - from the top.

## Syntax

`element.getBoundingClientRect();`

## Example

We get element coordinates:

`<div id="elem"></div>` `#elem { width: 100px; height: 100px; border: 1px solid black; }` `let elem = document.querySelector('#elem'); console.log(elem.getBoundingClientRect());`

## See also

- the `offsetParent` property
  that contains a parent with positioning
- the `offsetTop` property
  that contains the top offset of an element
- the `offsetLeft` property
  that contains the left offset of an element
- the `elementFromPoint` method
  that returns an element by coordinates

← →
↑
en ru