Non so che progressi hai fatto nel frattempo (sono stato in ferie alcuni giorni).

Comunque ci sono fondamentalmente due approcci possibili, ma che si escludono a vicenda, ed impongono di impostare le cose in modo diverso:
- quello (rigido) che avevi iniziato ad usare (con i posizionamenti assoluti o relativi)
- quello flessibile (fluido o liquido), che non usa posizionamenti.

La via di mezzo esiste (in teoria), ma necessita di una conoscenza perfetta delle due tecniche precedenti, e quindi te la sconsiglio.

Se scegli illayout flessibile, per centrare un blocco in orizzontale, la cosa e` nota da molto tempo in questo forum:
codice:
html, body {
  text-align: center;    /* per IE */
  width: 100%;          /* necessario in html, body e altri blocchi intermedi */
}
#tutto {
  margin: 0 auto;      /* per browser standard */
  text-align: left;        /* ripristina allineamento */
  width: ...;
}
Passare variabili da server a client e` un giochino semplice: ci sono vari esempi nel froum JS.

Cioè... Dici sostituendo "Strict" a "Transitional" nelle due ricorrenze del DOCTYPE?
Non puoi inventarti una nuova DTD. Devi seguire la sintassi corretta, che trovi in tutti i reference di HTML, ad esempio: http://www.w3schools.com/tags/default.asp alla voce DOCTYPE
E una volta scelta la DTD devi usare la sintassi corretta dei tag relativa alla DTD.
I validatori del W3C possono aiutare: validatore HTML e validatore CSS