DIV e immagine di sfondo con TAG img

[-AA-]

avrei 1 esigenza "particolare"
mi servirebbe fare un div largo 100px e alto 100px (e questo non è un prob)
al suo interno mi servirebbe mettere 1 immagine, che non sempre rispetta le dimensioni del DIV, l'immagine potrebbe anche essere 100x120 oppure 80x40 ...

Mi servirebbe per cui che
- l'immagine non mi sforma il div che deve obbligatoriamente essere 100x100
- l'immagine sia inserita nel codice con il "classico" tag [img][/img]

una cosa tipo:
<div style="width:100px; height:100px;">
[img]pippo.jpg[/img]
</div>

-------------
Come posso otterene questa cosa?
ha... non mi interessa che l'immagine venga "tagliata" se non rispetta i 100x100 do priorità al tag di inserimento

in sostanza come posso nascondere la parte di immagine in eccesso e mantenere l'inserimento di tale immagine con [img][/img]?

[Mich_]

Nel CSS devi inserire una sola dimensione per l'immagine (solo height o solo width).

HTML:
<div class="centocento">
  [img]...[/img]
</div>

CSS:
.centocento {
  width: 100px;
  height: 100px;
  background: red;    /* di prova - solo per veder come si comporta */
}
.centocento img {
  width: 94%;          /* cosi` resta un po` di margine */
  margin: auto;
}

Se deve funzionare in IE6, credo occorrano degli hack.

Se non vuoi che una possibile immagine verticale venga tagliata, devi determinare lato server se l'immagine e` vert. o orizz ed inserire il CSS in linea:
[img]...[/img] per l'immagine orizzontale
[img]...[/img] per l'immagine verticale
(ed in questo caso togli il width dal CSS generale)

[-AA-]

Grazie Mich_ per la tua risposta

In realtà "l'eccesso di questa img" vorrei proprio nasconderlo verticale o orizzontale che sia, lasciando inalterata la misura del DIV, è un catalogo prodotti per cui i box stanno bene se non vengono sformati.

Il ridimensionamento immagine potrei farlo lato server sena problemi, ho anche provato ma ci sono dei casi dove una immagine tipo 150 x 90 ...forzando il 150 a 100 mi porta il 90 a 60 e l'immagine inizia ad essere "piccolina" anche se non mi sforma il DIV, per questo pensavo ad applicare l'immagine come sfondo ...anche annidando 2 DIV...immagine come sfondo con la priorità di inserirla con <IMG SRC>

[-AA-]

<DIV style= "width:100px; height:100px; background-repeat:no-repeat; background-image:url(<?php echo $immagine?>)"></DIV>

ovviamente otengo che l'immagine è di sfondo...potrei usare un "barbatrucco" anche se non so come realizzarlo.... ovvero mettere un div SOTTO per cui come se fosse nascosto ma senza proprietà hidden e in questo div mettere al suo interno <img src="" with50 height50 specificando sempre le dimensioni dell'immagine che ...anche se sformata non mi interessa ..tanto non si vede...

fattibile?

[Mich_]

Attenzione a non inserire errori di semantica.
Se l'immagine fa parte della informazione che vuoi che passi all'utente, va inserita con <img>; se e` un abbellimento va inserita come sfondo.
La domanda che ti devi porre e`: se l'utente non vede l'immagine, si perde qualcosa? Se la risposta e` che si perde qualcosa, devi usare <img>, se la risposta e` no, devi usare lo sfondo.

Comunque per fare il "clip" dell'immagine (visualizzare solo la parte che sta nel centocento), non devi darle dimensioni, ma usare:

.centocento {
  width: 100px;
  height: 100px;
  background: red;    /* di prova - solo per veder come si comporta */
  overflow: hidden;
}

In questo caso per l'immagine 80x40 vederesti un po` di rosso in giro (lasciando lo sfondo messo da me), che forse non e` quello che vuoi: potresti in tal caso dare una dimensione (una sola) all'immagine.
Oppure puoi definire SEMPRE la dimensione minore al 100%, in modo che l'immgine copra sempre tutto lo spazio e venga tagliata per la parte del lato lungo che eccede la forma quadrata.
Comunque un minimo di "intelligenza" lato server ti risolve la maggior parte dei problemi.

[-AA-]

Attualmente le immagini vengono trattate con un piccolo swf che dinamicamente carica l'immagine in questione.
Il mio problema sono i motori di ricerca, ho un catalogo di 40.000 articoli con dei titoli e nomi stupendi ma avendo messo logni singola immagine dentro flash questa viene ignorata ovviamente... per dar peso ad ogni singola voce per cui mi stavo atrezzando per inserire in qualche modo (non da ban) il tag img applicandoci per cui i vari ALT e TITLE.

Questo è lo scopo che devo ottenere rispettando però la forma estetica attuale.

[-AA-]

Mi sa che rifarmi il BOX completo con i css e sfruttando gli z-index faccio prima che andare a rischiare con hidden e simili.

Grazie cmq Mich_ di avermi chiarito alcune cose