Html - Aiuto Formattazione Tabella

**mrkrab** · 28-11-2012, 13:19

Ciao a tutti,

Ho un problema nel creare bene una tabella, l'esempio vivente è il mio sito internet:

http://horazio.webs.com

il problema è che con IE sembra tutto OK, le caselle a sx hanno tutte la stessa altezza ma se uso Chrome o altri browsers le prime caselle sono strette e l'ultima divanta grande rendendo
il mio sito molto più brutto

Ho fatto qualche tentativo ma non riesco a sistermarlo, qualcuno sa dirmi come fare x fare tutte le caselle a sinistra della stessa altezza x tutti i browsers.

grazie in anticipo

**ac_socmel** · 28-11-2012, 13:45

devi studiare una guida perché ti mancano le basi

**Prill** · 01-12-2012, 00:25

Ciao, con le tabelle e le altezza bisogna fare un po' di attenzione. Innanzitutto hai specificato per la tabella un'altezza che serve a poco, primo perché height non è un attributo valido per il tag table; secondo perché hai una altezza in percentuale che non serve in quanto per usare un'altezza in percentuale è necessario che l'altezza sia espressa anche per il contenitore del nostro elemento (nel nostro caso la tabella) quindi body e html.
Invece non hai specificato le altezze per le celle e Chrome assegna alle prime lo spazio necessario per i contenuti e tutto lo spazio restante lo attribuisce all'ultima cella (gli altri browser lo ripartiscono uniformemente). Si risolve assegnando una altezza alle celle a sinistra.

Poi:
aggiungiamo un Doctype;
eliminiamo tag da evitare come font e center;
eliminiamo quegli attributi che ormai non si usano più per body (alink eccetera);
tutto ciò che appartiene a una formattazione ripetuta impostiamolo nel foglio di stile (tutti i bold per i link, l'allineamento centrato delle celle);
ripuliamo qualche altra cosa e otteniamo la nostra pagina funzionante:

codice:

<!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>Horazio's Website</title><style type="text/css">
<!--
body {
	background-color: #000033;
	color:#ffffff;
	font-family:Arial;
}
a {
	color:#ffffff;
	font-weight:bold;
}
td {
	text-align:center;
	height:65px;
}
-->
</style>
</head>

<body>
<table width="95%" border="1" align="center">
  <tr>
    <td width="20%">FACEBOOK</td>
    <td rowspan="8"><h2>Software per la scuola</h2> 
		<iframe width="420" height="300" src="omesso" frameborder="0"></iframe>
		<h2>IT Resources for school</h2></td>
  </tr>
  <tr>
    <td>AUTHOR</td>
  </tr>
  <tr>
    <td>TECH.INFO</td>
  </tr>
  <tr>
    <td>SOFTWARE</td>
  </tr>
  <tr>
    <td>LEGAL</td>
  </tr>
  <tr>
    <td>FORUM</td>
  </tr>
  <tr>
    <td>ACTIVATE</td>
  </tr>
  <tr>
    <td>MAIL</td>
  </tr>
</table>
</body>
</html>

Però dovremmo evitare di usare le tabelle...

Discussione: Html - Aiuto Formattazione Tabella

Strumenti discussione

Ricerca discussione

Visualizza

Html - Aiuto Formattazione Tabella

Permessi di invio