Problema nell'allineare una tabella e un'immagine

[afterhours1988]

Salve,
come da titolo devo mettere una tabella e un' immagine in una stessa riga (tabella a sinistra e immagine a destra)!! Ho messo "display: inline;" nel css della tabella ma niente: la tratta sempre come un elemento di tipo block e l'immagine successiva la posiziona in una riga diversa. Come devo fare?

Posto il codice:

<table cellspacing="4" style="display:inline;">
	<tr>
		<td></td>  
		<td></td>
	</tr>
	<tr>
		<td></td>  
		<td></td>  
	</tr>
	<tr>
		<td></td>
		<td></td>
	</tr>													
</table>										

[img][/img]

Non so se la cosa possa essere interessante ma sia la tabella che l'immagine si trovano all'interno di un fieldset.
Grazie in anticipo per eventuali risposte

[KillerWorm]

Ciao,
probabilmente stai usando chrome. La proprietà display:inline applicata sulle tabelle si comporta in modo visibilmente differente tra i vari browser.

A mio parere puoi risolvere con una cosa del genere:

<table cellspacing="4" style="display:inline-block">
	<tr>
		<td>bim</td>  
		<td>bum</td>
	</tr>
	<tr>
		<td>bam</td>  
		<td>qui</td>  
	</tr>
	<tr>
		<td>quo</td>
		<td>qua</td>
	</tr>													
</table>		
[img]image.jpg[/img]

"inline-block" non è supportato dai vecchi browser.
Per vertical-align puoi assegnare diversi valori a seconda di come vuoi posizionare l'immagine rispetto alla tabella. In questo caso ho messo top per allineare i due elementi rispetto alla parte alta. Per altri valori vedi http://www.w3schools.com/cssref/pr_p...ical-align.asp

[afterhours1988]

Ottimo.. funziona, grazie mille!!
Adesso il mio problema é un altro.. si vede che sono alle prime armi??

In pratica, voglio che l'immagine abbia lo stesso margine a sinistra e a destra, cioè vorrei che si trovasse al centro tra la fine della tabella e il margine del fieldset.
Ho provato mettendo margin-left: auto; margin-right: auto; ma sembra che la metta al centro del fieldset e non prenda in considerazione la tabella.

Sapreste aiutarmi??
Grazie in anticipo per eventuali risposte!

[KillerWorm]

Questo cambia le cose.. la tabella devi lasciarla in alto e tutto a sinistra?
Se sì, allora metti semplicemente un bel float:left alla tabella e margin:0 auto per l'immagine:

<table style="float:left">
	<tr>
		<td>bim</td>
		<td>bum</td>
		<td>bam</td>
	</tr>									
</table>
[img]image.jpg[/img]

Vedi se può andare così.

[afterhours1988]

Allora, come mi hai consigliato tu non mi funzionava.. metteva l'immagine al fianco della della tabella. Ho risolto, utilizzando sempre i tuoi preziosi consigli, mettendo l'immagine all'interno di un div. Ecco il codice:

<table style="float:left">
	<tr>
		<td>bim</td>
		<td>bum</td>
		<td>bam</td>
	</tr>									
</table>
<div align="center" style="width: 100%;">
        [img]image.jpg[/img]
</div

Grazie mille per gli utilissimi consigli: HO IMPARATO QUALCOSA DI NUOVO!!! GRAZIEE

[KillerWorm]

Sì hai ragione, scusami, ho fatto un po' di confusione mentre provavo qualche soluzione.
In effetti avevo inserito il tutto dentro un fieldset al quale avevo messo la proprietà text-align:center, di fatti l'immagine si allineava al centro essendo un elemento inline (ma a quel punto il "margin:0 auto" non serviva a meno che non si applichi all'immagine anche il display:block).
Può andare bene la tua soluzione ma ripulendo un po' il tutto si può fare anche senza div aggiuntivo con una cosa del genere:

<fieldset style="text-align:center">
  <table style="float:left">
    <tr>
      <td>bim</td>
      <td>bum</td>
      <td>bam</td>
    </tr>			
  </table>
  [img]image.jpg[/img]
</fieldset>

oppure, come accennato, facendo diventare l'immagine un blocco e applicando il margin auto:

<fieldset>
  <table style="float:left">
    <tr>
      <td>bim</td>
      <td>bum</td>
      <td>bam</td>
    </tr>				
  </table>
  [img]image.jpg[/img]
</fieldset>

Vedi tu cosa preferisci. Alla prossima