immagini che non deformino formattazione tabella

[Miki73]

Ho un problema che riguarda l'aspetto della mia home-page:

    <table>
      <tr>
        <td id="foto">
          . . .
        </td>
        <td id="titolo">
          . . .
        </td>
      </tr>
      <tr>
        <td colspan="2" id="navbar">
          . . .
        </td>
      </tr>
      <tr>
        <td id="cornice">
          . . .
        </td>
        <td id="centro">
          . . .
        </td>
      </tr>
    </table>

le foto che sono presenti nelle varie celle potrebbero deformare le celle che le contengono; come posso mantenere fisse le loro lunghezze che però volevo mantenessero la dipendenza dalla risoluzione usata dall'utente?
dopo vari tentativi credo che la soluzione sia andare ad impostare sul file css gli attributi width delle img nelle varie celle, ma non saprei come...

body { 
       font-family: tahoma, verdana, arial;
       text-align: center;
       width: 780px;
     }

#foto {
        background-color: #003366;
        color: white;
      }

#foto img { width: 254px; }

#titolo {
          background-color: #003366;
          color: white;
        }

#navbar {
          width: 780px;
          background-color: #003366;
          border-width: 0px;
        }

#navbar input { height: 18px; }

#cornice {
           width: 254px;
           background-color: #003366;
           color: white;
         }

#cornice img { height: 140px; border: thin solid white; }

#centro {
          width: 526px;
          height: 751px;
          color: #003366;
          font-size: 11px;
        }

#centro img { width: 470px; }

img {
      border-style: none;
    }

insomma vorrei mantenere fisse le proporzioni delle celle rispetto alla tabella e la tabella rispetto alla risoluzione, e che le immagini non influissero se esse acquisendo al massimo le stessa lunghezza della cella che le contiene!

[Mich_]

Per i browser conformi, esistono le proprieta`:
width
height
min-width
max-width
min-height
max-height

Per il browser IE, esistono solo width e height, ma si comportano come min-width e min-height.

Questo ti suggerisce come correggere per i browser conformi, ma non per IE.
E non credo ci siano degli hack specifici, se non ridimensionando le immagini tramite JS.

[pugia]

http://www.constile.org/tips/min-height/ e per il min-width vale la stessa cosa

[Mich_]

Originariamente inviato da pugia
http://www.constile.org/tips/min-height/ e per il min-width vale la stessa cosa

Se ho capito giusto, lui vuole fare in modo che un oggetto non vada oltre le dimensioni impostate, quindi ha bisogno di un max-height sull'immagine oppure un height sul contenitore dell'immagine.
Se la mia interpretazione e` corretta, il tuo link non gli serve (aspettiamo a vedere cosa dice).

[Miki73]

quindi si può risolvere per i browser conformi (come Firefox dunque?) ma non per Internet Explorer ammenochè non mi serva di JS che ancora conosco troppo poco (sto invece utilizzando il php); forse potrei dopo dei tentativi ottimizzare per le risoluzioni 1024x768 e 800x600 che dovrebbero essere ancora le più utilizzate in base alla risoluzione (che spero si possa leggere da qualche variabile); per il momento ho ottimizzato per la risoluzione che adotto io con tutte impostazioni di lunghezza e altezza fisse senza mai un valore in percentuale... ovviamente è una cosa provvisoria!
Ah grazie per la risposta.

[Mich_]

Capisco che vuoi lavorare per gradi, ma cosi` rischi di fare il lavoro due, tre o forse piu` volte.

Se vuoi usare bene i CSS devi:
1. Scrivere il codice HTML con i contenuti (niente formattazione). Il codice deve rispettare la logica dei contenuti
2. Scrivere il CSS, tenendo presente che il numero dei browser e` piuttosto alto (sono una decina quelli piu` usati, ma escludendo quelli specifici per determinati scopi, alla fine sono un centinaio quelli reperibili in qualche modo sulla piazza, e non puoi permetterti di "tagliar fuori" qualcuno).

Quindi se parti dalla risoluzione, intraprendi una strada senza uscita.
Vedi invece qualche esempio di pagina formattata bene (cerca tra i "link utili"), e prendi ispirazione.