td img {display: block;} vorrei assegnarlo solo ad una parte di html

**pmi** · 12-02-2007, 23:13

Salve,

ho creato una nuova interfaccia grafica utilizzando fireworks che mi ha generato il seguente codice.
Per farla funzionare correttamente è necessario <style type="text/css">td img {display: block;}</style> altrimenti mi compaiono degli spazi bianchi fra le celle della tabella,
purtroppo questo style mi influenza negativamente le altre parti della pagina,

come devo fare per assegnare questo style solo al seguente codice?

Grazie

codice:

<style type="text/css">td img {display: block;}</style>

</head>
<body bgcolor="#ffffff">
<table border="0" cellpadding="0" cellspacing="0" width="970">
  <tr>
   <td>[img]../icone/barratop-forum/barratop-forum_r1_c1.jpg[/img]</td>
   <td><table align="left" border="0" cellpadding="0" cellspacing="0" width="807">
	  <tr>
	   <td><table align="left" border="0" cellpadding="0" cellspacing="0" width="807">
		  <tr>
		   <td>[img]../icone/barratop-forum/barratop-forum_r1_c2.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r1_c15.jpg[/img]</td>
		  </tr>
		</table></td>
	  </tr>
	  <tr>
	   <td><table align="left" border="0" cellpadding="0" cellspacing="0" width="807">
		  <tr>
		   <td>[img]../icone/barratop-forum/barratop-forum_r2_c2.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r2_c3.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r2_c15.jpg[/img]</td>
		  </tr>
		</table></td>
	  </tr>
	  <tr>
	   <td>[img]../icone/barratop-forum/barratop-forum_r3_c2.jpg[/img]</td>
	  </tr>
	  <tr>
	   <td><table align="left" border="0" cellpadding="0" cellspacing="0" width="807">
		  <tr>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c2.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c4.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c5.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c6.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c7.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c8.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c9.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c10.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c11.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c12.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c13.jpg[/img]</td>
		   <td>[img]../icone/barratop-forum/barratop-forum_r4_c14.jpg[/img]</td>
		  </tr>
		</table></td>
	  </tr>
	</table></td>
  </tr>
</table>

**mahamatt** · 13-02-2007, 11:27

Per prima cosa bisogna dire che la tabella (o di più tabelle nidificate), come strumento di layout, è una scelta errata e deprecata dagli standard moderni: una tabella dovrebbe essere usata solo quando si hanno dei dati da intabellare in modo ordinato, su più righe / colonne. La tabella non è nata per fungere da layout, anzi, un uso simile costituisce un limite in termini di accessibilità dei contenuti; impedisce inoltre ai css di esprimere la loro massima potenzialità.

Comunque, per venire al tuo problema, basta che nel css esterno (o interno?) crei un ID, che chiamerò "nientespazi", in questo modo:

codice:

table#nientespazi img {display: block;}

A questo punto, nel codice html, devi applicare l'ID alla tabella, così:

codice:

<table id="blocco">

In questo modo, a tutti i tag <img> contenuti nella <table> che come ID avrà "nientespazi", sarà applicato l'attributo display:block.

Ciao e buon lavoro

**pmi** · 13-02-2007, 12:37

Ciao mahamatt,

come dovrei fare per costruire questa struttura grafica senza le tabelle e renderla compatibile con i vari browser?
ho provato con fireworks ma non ci sono opzioni per eliminarle, l'unica opzione è quella di
di utilizzare una sola tabella con le immagini spaziatrici che vengono posizionate sopra e a destra, ma non sono un gran che carine!

Se nel css ci inserisco questo style

table#nientespazi img {display: block;}

nella tabella ci devo inserire:

oppure questo:

non capisco il perchè ma quel problema degli spazi bianchi ce l'ho solo con IE.

Grazie

**J-MK** · 13-02-2007, 13:05

Mi intrufolo

devi mettere <table id="nientespazi"> lui ha scritto blocco ma penso sia stato un lapsus, l'avrà confuso con block.

Per quanto riguarda l'impaginazione, beh uno su tutti dreamweaver ti aiuta molto per impaginare senza tabelle. Poi dipende se ti piace che il programma ti aiuti o meno... io lo odio ad esempio, preferisco il blocco note, che combinato con l'uso dei css anche per il posizionamento, ti permette di fare tutto.

**mahamatt** · 13-02-2007, 13:14

Scusami, stavo scrivendo su più post e ho fatto un po' di casino col copia-incolla!!! nell'html devi inserire:

codice:

<table id="nientespazi">

come hai giustamente osservato. Perdona il lapsus

In linea generica posso dirti che tutte le immagini grafiche (ovvero, che fanno parte dell' "interfaccia" del sito e non hanno contenuto informativo) andrebbero inserite come background per dei <div>.

Per avere un'idea su come realizzare un layout grafico senza tabelle, questo è un ottimo punto di partenza.

Sconsiglio l'uso di fireworks (che di default impiega le tabelle), a favore della combinazione photoshop + notepad, cosa che ho collaudato nel tempo; trovo sia la soluzione che ti permette di creare il codice più pulito, leggero e trasparente in assoluto. Certo, c'è da studiare un po'

....ma ne vale la pena!

Per il resto, ti darei consigli più spiccioli, ma faccio un po' fatica a comprendere il layout che vorresti realizzare, dovrei dargli un'occhiata d'insieme. Esiste un url?

**Leilond** · 14-02-2007, 17:09

Dai su... non siate esagerati... NOTEPAD no
Ci sono dozimiliardi di editor gratuiti PURO TESTO che però ti danno una mano evidenziando i colori e mantenendo l'indentazione, con funzioncine di ricerca/sostituzione testo e apertura di più file contemporaneamente... non facciamo i puristi inutilmente

Congliamo un bono "editor testuale" invece di consigliare NOTEPAD... siamo più credibili

**mahamatt** · 14-02-2007, 17:29

beh, io dico notepad per farmi capire, poi è ovvio che non è necessariamente il notepad nativo di windows

per dire, io uso METAPAD e mi trovo benissimo........

Discussione: td img {display: block;} vorrei assegnarlo solo ad una parte di html

Strumenti discussione

Ricerca discussione

Visualizza

td img {display: block;} vorrei assegnarlo solo ad una parte di html

Permessi di invio