Как сделать переход по якорю не в самый верх страницы

[kvant]

Есть некая страница

<div class="box" id="box1">
1
</div>
<div class="box" id="box2">
2
</div>
<div class="box" id="box3">
3
</div>
<div class="box" id="box4">
4
</div>
....
<div class="box" id="boxN">
N
</div>

По ссылкам к каждому id происходит переход по якорю, например <a href="#box4">. При этом страница прокручивается так, что выбранный элемент оказывается в самом верху страницы. Как сделать так, чтобы элемент становился не в самый верх, а с некоторым отступом от верха. Пробовал менять padding/margin у body, но браузеру на это начхать, поэтому решил спросить в разделе Javascript, может скриптами как-то можно сделать. В идеале хотелось бы чтобы выбранный элемент был по середине страницы, но если так не получится, то хотя бы с некоторым отступом от верха.

Edited February 19, 2013 by kvant

[Sensei]

.box {
   padding-top: 80px;
}

или, если используете jquery http://jsfiddle.net/WAJGV/