Как подсчитать расстояние между левой границей и началом текста в text-align: centtered div?

Question

<div style='text-align: center; width: 300px'>test me</div>

, поэтому мне нужно поле px влево от левой стороны до первой буквы строки в div?

Answer 1

Единственный способ подсчитать расстояние между символом и его контейнером - добавить встроенный элемент перед текстом, а затем вычесть левое смещение родителя из заполнителя (используя .offset()) .

Пример ( DEMO: http://jsfiddle.net/LM8xL/)

HTML:

<div id="some-div" style='text-align: center; width: 300px'>test me</div>

JavaScript:

var $elem = $("#some-div"),     // Select element
    $placeholder = $("<span>"); // Create inline placeholder
$elem.prepend($placeholder);    // Add placeholder before its contents

// Calculate distance
var distance = $placeholder.offset().left - $elem.offset().left;
$placeholder.remove();          // Remove placeholder
alert(distance);                // Example: Display result

Answer 2

Как сказал Калашников, вам нужно обернуть текст в тег span, но нужно проделать дополнительную работу. Вам нужно получить позицию диапазона и смещение родителя (div) и вычесть их, чтобы получить ответ. Вот код:

var position = $("span").position();
var parentOffset = $("span").parent().offset();
var left = position.left - parentOffset.left;

Answer 3

Может быть обернуть ваш текст другим элементом (span) и сравнить его .offsetLeft с вашими div?