стили Css в зависимости от высоты активной области браузера
 

Доброе время суток!

Всем известно, что для определенных браузеров можно установить свои стили css.

Мне нужно, чтобы если высота активной области браузером была меньше определенного значения - использовался бы определенный набор стилей css, если превышает данное значение - то используется другой набор стилей.

У меня некий проект, который требует именно такого исхода событий. Т.е. весь центральный блок расположен ровно по центру, по средствам 50% 50% и 'марнинг'. А при маленькой высоте активной области браузера скрывается часть контента. Я и хочу сделать так, чтобы при достаточной высоте блок располагался по центру, как описано выше, а если недостаточно - то используется другой набор стилей, где блок располагается уже на конкретном расстоянии от верхней границы!

И разумеется это должно обрабатываться до загрузки.

Помогите реализовать такую идею.

Заранее спасибо.

Звучит как посыл в дешевой рекламе...

window.onload = function() {
	var link = document.createElement("LINK");
	link.rel = 'stylesheet';
	link.type = 'text/css';
	link.href = document.body.offsetHeight > 500 ? 'first.css' : 'second.css';
	document.getElementsByTagName('HEAD')[0].appendChild(link);
}

Увы как сделать до загрузки страницы не знаю, так как узнать высоту body можно только после загрузки.

спасибо, вроде все правильно работает!