К сожалению, я ровным счетом ничего не понял...

Одна страница получена из другой простым копированием и заменой DOCTYPE, как это указано в теме.

Как при этом могли появиться различия в top, как Вы их увидели?

Простым поиском по странице я не вижу даже самих чисел 132 и 716...

<div style="z-index: 999; border-bottom-color: blue; border-bottom-width: 5px; 
border-bottom-style: solid; position: absolute; border-left-color: blue; border-left-width: 5px; 
border-left-style: solid; padding-bottom: 10px; padding-left: 10px; width: 350px; 
padding-right: 10px; background-attachment: scroll; background-repeat: repeat; background-image: none;
 background-position: 0% 0%; background-size: auto; background-origin: padding-box; background-clip: border-box; 
background-color: rgb(236, 242, 230); height: 130px; 
border-top-color: blue; border-top-width: 5px; border-top-style: solid; border-right-color: blue; 
border-right-width: 5px; border-right-style: solid; padding-top: 10px; left: 434.5px; top:
 295.5px;" id="myDiv">

Вообще, Вы сами то как шапку делаете? DOCTYPE уазываете? Каким образом?

<script>
onload = function ()
{
with (document.getElementById ('myDiv').style)
   left = (document.body.clientWidth  - 350) / 2 + 'px',
   top  = (document.body.clientHeight - 130) / 2 + 'px';
}
</script>
<div style="z-index: 999; border: 5px solid blue; position: absolute; padding: 10px; width: 350px; background-color: rgb(236, 242, 230); height: 130px; left: 768.5px; top: 585px; background-position: initial initial; background-repeat: initial initial;" id="myDiv">
<p style="TEXT-ALIGN: right; MARGIN: 0px; CURSOR: pointer" onclick="this.parentElement.style.display = 'none'"><img border="0" src="221_files/x.png" width="25" height="29"></p>
<p style="TEXT-ALIGN: center; MARGIN: 0px; FONT-FAMILY: Arial,Helvetica sans-serif; COLOR: black; FONT-SIZE: 18px">Приветствуем!</p>
</div>

если по середине экрана, то лучше сделать position: fixed
+ центрировать не по документу, а по окну браузера, основная ошибка,
и для правильного положения нужно еще вычитать размеры самого всплывающего окна, padding тоже увеличивает размеры div

_____________
"internet explorer всех правильней отображает страницы" ©

А если от очень сложной и непонятной мне теории перейти к практике?

Что конкретно нужно изменить, чтобы прямоугольничек был в середине экрана?

Спасибо!

Владимир55

var clientHeight = Math.min(document.documentElement.clientHeight, document.body.clientHeight);

или с использованием jQuery

var clientHeight = $(window).height(); 

Спасибо за идею!
Но, к сожалению, у меня не хватает знаний для того, чтобы ею воспользоваться...

Как эти конструкции вставить в изначальный код, куда?

(jQuery к странице подключен, но интересны оба варианта).

вместо

document.body.clientHeight

Math.min(document.documentElement.clientHeight, document.body.clientHeight)

на jQ весь код

onload = function ()
{
with (document.getElementById ('myDiv').style)
   left = (document.body.clientWidth  - 350) / 2 + 'px',
   top  = (document.body.clientHeight - 130) / 2 + 'px';
}

заменить на

$(function(){
    $('#myDiv').css({
        'left' : parseInt($(window).width() / 2)  + 'px',
        'top'  : parseInt($(window).height() / 2) + 'px'
    })
})

В первом случае прямоугольничек прилипает к левому верхнему углу - см. вот

(На jQ сейчас попробую)

При использовании jQuery почему-то сползает вправо и вниз - см. тут