How to get field size left using javascript when i use margin auto property in css

Question

I have a div with margin:auto; and I need to get only margin-left size using javascript :)

 //css .test{ margin: auto; width: 100px; height: 100px; outline: 1px solid red; } // html <div class="test">Test</div> 

Living example

Answer 1

Use this:

1) Using jQuery

 var left = $(".test").offset().left; 

2) Or the second version is this: Replace your div with <div class="test" id="test"></div> and use this js.

 var left = document.getElementById("test").offsetLeft; 

Answer 2

You do not need jQuery for this, simple JavaScript is enough:

 var left, element = document.querySelector('.test'); if(element) { left = element.getBoundingClientRect().left; } 

Answer 3

You can use window.getComputedStyle () if you don't need IE8 support.

  var test = document.querySelector('.test'); var left_margin = window.getComputedStyle(test).getPropertyValue("margin-left"); // returns margin eg '655px' left_margin = left_margin.match(/\d+/); //returns bare number eg '655'