Выравнивание по центру
 

Добрый день друзья! Возникла проблема , написана карта. Сетка отрисовывается с помощью JS + CSS и заселяется в DIV#MAP...

Поле сейчас размером 20х20 клеток , каждая клетка 100 по ширине и высоте. Для создания псевдо изометрии высоту делю на 2. Слой карты имеет ( position: fixed; ) , каждая клетка ( position:absolute; ). Для элемента управления карте добавлен draggable jquery.

Вопрос: как сделать выравнивание карты строго по центру (по высоте и ширине окна) , и выравнивать в зависимости от изменения размеров окна ?

Высота и ширина документа

document.documentElement.clientHeight;
document.documentElement.clientWidth;

Ширина и высота элемента.

var heightElem = parseInt(getComputedStyle(elem).height);
var widthElem = parseInt(getComputedStyle(elem).width);

Спозиционировать элемент строго по центру можно так

var Elem = document.querySelector('div#map');
Elem.style.top = (document.documentElement.clientHeight - heightElem)/2;
Elem.style.left = (document.documentElement.clientWidth - widthElem)/2;

Чтобы позиционирование изменялось под размер экрана, нужно засунуть код выше в функцию и повесить её на событие window.onresize

Дружище спасибо! :) В своем решении использую Jquery ( .css )

А я люблю по-хардкору. Да и Jquery не порушится, если добавить пару строк кода на нативном JS.))