Box Model o tabelle??? Alcuni chiarimenti sui CSS

[spiadadda]

Ciao a tutti,
mi sto avvicinando al mondo dei CSS e lo sto facendo leggendo e studiando la guida di html.it

Sto a buon punto, ma ho molti dubbi....e per questo ho pensato di chiedere a voi che ne sapete, sicuramente, più di me.

Io fino ad adesso ho sempre usato, per formattare la pagina e quindi costruire il layuot, le Tabelle HTML. Leggendo la guida ho letto che si può ottenere lo stesso risultato utilizzando i box model....., ma mi piacerebbe conoscere quali differenze ci sono tra le tabelle HTML e i Box model. Soprattutto quale conviene utilizzare e perchè?

Vorrei approfittare anche per chiedere un altra cosuccia sempre in merito ai CSS...leggendo la guida sto anche facendo qualche prova e sto smanettando un pò con i fogli di stile esterni..... In particolare ho dei problemi con la formattazione di alcune tabelle.... in parole povere io voglio fare una tabella di questo tipo:

<table width="500%"  border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
        <tr>
          <td></td>
        </tr>
      </table>

Come posso ottenere lo stesso risultato con i css??
Ci sto provando e seguo le istruzioni della guida, ma non riesco ad ottenere lo stesso risultato del HTML...in particolare il problema riguarda i Margini della cella e la Spaziatura della cella, infatti pur settandoli pari a 0 (zero) mi compaiono lo stesso...cioè la tabella e le celle presentano comunque una spaziatura e un margine....... Perchè? Mi fate vedere, per piacere, qual'è la maniera corretta di operare in modo da capire dove sbaglio??

Grazie
Ciao Ciao

[fcaldera]

<table>
    <tr>
         <td> </td>
    </tr>
</table>



table, td {
     margin : 0;
     padding : 0; 
}

table {
   width : 500px;
   border : 0;
}

[spiadadda]

Ciao e grazie per la tua risposta.
Ho provato come mi hai consigliato, ma il problema persiste....sicuramente sbaglio io in qualcosa....provo a spiegarmi meglio.

Allora io ho una struttura di questo tipo:

<table  align="center"  class="table_principale">
  <tr>
    <td valign="top"><table class="table_img">
      <tr>
        <td>[img]immagini/immagine_prova.jpg[/img]</td>
      </tr>
    </table>
      </td>
  </tr>
</table>

e ho impostato il css esterno in questo modo:

/* Tabella principale : Il bordo di destra e quello di sinistra sono di colore Bianco e di 2px, gli altri nessun spessore*/
.table_principale	{ 
	table-layout: fixed;
	width: 500px ;
	background-color: #009900;	
	border-top: none;
	border-right: solid #FFFFFF 2px;
	border-left: solid #FFFFFF 2px;
	border-bottom: none;
	
}
.table_principale, td  {
	 width: 500px ;
	 margin : 0;
     padding : 0; 
	
}
	
/* Tabella contenente l'immagine*/
.table_img	{ 
	table-layout: fixed;
	width: 760px ;		
}

Il problema è che tra la prima e la seconda tabella mi compare un piccolo margine.... che io vorrei eliminare.Infatti a causa di questo margine l'immagine non combacia perfettamente con i bordi laterali....

Dove è l'errore?
Possibilmilmente mi spiegate in modo da capire.
Grazie
ciao ciao

[salasir]

Forse è sufficiente:

* Tabella contenente l'immagine*/
.table_img	{ 
	table-layout: fixed;
	width: 760px ;		
             margin : 0; 
 }

Ma .... sei sicuro di volere una tabella, dentro ad una tabella, che contiene un'immagine?

Se esponi il risultato che vuoi ottenere, forse troviamo una soluzione più idonea.
Le tabelle servono per un'aggregazione di dati con relazione riga/colonna, non per il layout.

[spiadadda]

Stavo proprio adesso leggendo questa guida la quale spiega l'attuale tendenza verso i Box model per la realizzazione dei template! Io fino adesso ho sempre utilizzato le tabelle per costruire i template e anche il mio attuale sito è realizzato con esse. Leggendo la guida ho scoperto che è più conveniente, per vari motivi, non adottare le tabelle.

Originariamente inviato da salasir
Ma .... sei sicuro di volere una tabella, dentro ad una tabella, che contiene un'immagine?

Se esponi il risultato che vuoi ottenere, forse troviamo una soluzione più idonea.
Le tabelle servono per un'aggregazione di dati con relazione riga/colonna, non per il layout.

Mi sto da poco cimentando con i css e stavo cercando di riprodurre il layout della Home del mio sito, il cui layout attuale è realizzato con le tabelle, con i css....,ma non so proprio da dove iniziare! Per me il sito è un Hobby ma mi piacerebbe realizzarlo con i css in modo da facilitare anche gli eventuali aggiornamenti...

Qualche consiglio?

[pierofix]

Per un'introduzione generale alla progettazione intelligente, spero questo articolo possa darti una mano:

- http://pesanervi.diodati.org/pn/index.asp?a=293

[spiadadda]

Credete che è possibile riprodurre con i css un layout come quello del sito nella mia firma (che è stato fatto con le tabelle)???

ma con macromedia dreamweare è possibile realizzare layout utilizzando i DIV e i css esterni???

Io ho sempre usato dreamweare e adesso mi trovo un pò spiazzato...... VVoVe: VVoVe: come faccio a costruire la struttura del layout??

[salasir]

Dopo aver letto l'articolo di Piero, che ti dà l'idea di come ragionare per impostare un layout CSS (non come faccio a trasformare una tabella in div, ma che veste metto a questi contenuti), sicuramente devi farti un po' d'esperienza con i CSS (Nei link utili ci sono molti rimandi a manuali, tutorial ed esempi).

Poi puoi prendere una base come queste Layout Gala scegliendo tra layout fisso od elastico e cominci a modificare il CSS secondo le tue esigenze.

Mi raccomando anche di decidere prima che livello vuoi usare di linguaggio (HTML o XHTML, la versione e se transitional o strict). Visto che cominci ti conviene utilizzare xhtml 1.0 strict. Recommended DTDs to use in your Web document.
Per i problemi che incontri ... siamo qui.

[spiadadda]

Grazie per i preziosi consigli...nel frattempo faccio un pò di pratica e leggo il più possibile....ci risentiamo fra qualche giormo.

Ciao Ciao