Dreamweaver: centrare una tabella.
Innanzitutto complimenti per il forum! Leggendolo ho risolto molti dubbi che mi portavo dietro da tempo!
Purtroppo non sono riuscita a trovare una soluzione ad un problema che mi sta facendo impazzire da alcuni giorni.
Sto realizzando un sito nel quale ero intenzionata ad inserire in home page un'immagine centrata sia orizzontalmente (e fin qui grazie a Dio non ci sono problemi
) sia verticalmente su tutti i monitor con risoluzione equivalente e/o superiore a 800x600px. Vi spiego quello che ho fatto.Ho creato una tabella nidificata di 760x430px per ospitare l'immagine (in realtà codice html generato da Fireworks, ma questo non ha importanza) all'interno di un’altra di dimensioni in percentuale pari al 100% sia in larghezza che in altezza. L’ho quindi centrata e fin qui, almeno nell’area di lavoro di Dreamweaver, tutto bene.
Facendo l’anteprima su Internet Explorer, però, la triste verità: centrata sì orizzontalmente ma non verticalmente! Vi dico la verità, ho fatto diverse prove... sembrerebbe una cosa stupida... eppure, alla fine, ho notato una cosa molto strana (almeno per me): togliendo le prime 2 righe di codice che riguardano la validazione w3c, la tabella veniva centrata anche verticalmente! Ho provato quindi, per curiosità, a convertire il codice html in xhtml, e, come mi aspettavo, stessa cosa.
La domanda è molto semplice: è possibile far convivere le due cose?
Vorrei mantenere la dichiarazione inserita da Dreamweaver... possibile che lo standard w3c non preveda una cosa del genere? O forse sono su una strada completamente sbagliata?
Vi ringrazio anticipatamente per una vostra possibile disponiblità.
Ciao a tutti!
P.S. Vi allego il codice (la tabella in questo caso, non è impostata in altezza e racchiude la scritta "prova", ma a titolo d'esempio è la stessa cosa):
<!-- Commento aggiunto per non interferire con il codice della pagina del forum di 001design.it.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento senza titolo</title>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style></head>
<body>
<table width="100%" height="100%" border="0">
<tr>
<td align="center" valign="middle"><table width="760" height="0" border="0" align="center">
<tr>
<td><div align="center">prova</div></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
Fine commento aggiunto per non interferire con il codice della pagina del forum di 001design.it. -->
Risposte
Ciao Roberta,
benvenuta, grazie per aver scelto 001design.it e per i complimenti che sono sempre graditi.
Nel caso volessi pubblicare un feedback o commento su 001design.it puoi farlo nella sezione apposita: http://www.001design.it/forum_italiano/forums.php?id=18
Adesso vediamo di risolvere il tuo problema.
Ho impostato il valore margin-top in percentuale (nel tuo stesso stile .body) invece che in pixel, vedi se è il risultato che vuoi ottenere. Nota che ho impostato i valori dei border a 1 per vedere le tabelle ed ho aggiunto anche cellpadding="0" cellspacing="0" alla prima tabella, che è sempre consigliabile inserirli.
Spero che ti risolva il problema e che sia il risultato che volevi ottenere, ciao.
<!-- commento aggiunto per non interferire con il codice della pagina del forum di 001design.it.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 12%;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
</head>
<body>
<table width="100%" height="100%" cellpadding="0" cellspacing="0" border="1">
<tr>
<td align="center" valign="middle"><table width="760" height="300" border="1" align="center">
<tr><td><div align="center">prova</div></td></tr>
</table></td></tr></table>
</body>
</html>
Fine commento aggiunto per non interferire con il codice della pagina del forum di 001design.it. -->
