div e immagine

[skunkio]

Salve a tutti,
non so se quanto sto per chiedere si possa effettivamente fare ma, per mia ignoranza in materia, ci provo.
All'interno delle mie pagine ho un div con dimensioni fisse dove dentro ci voglio mettere un img.
L'img non voglio però che sia ridimensionata o che "spinga" il div se più piccolo rispetto all'immagine stessa ma vorrei che nel div si vedesse solo la porsione di immagine (come se il div fosse una finestra) visible in base alle reali dimensioni del div.
Idee?

Saluti

[furbostandby]

Se il div ha height e anche width fisse, ti basta impostargli

overflow:auto;

questo fa apparire le barre di scorrimento se l'immagine è più grande del div, mentre questo

overflow:hidden;

nasconde le parti in eccesso e basta.

Ovviamente questa regola va applicata al div.

Ciao

[skunkio]

Ciao,
all'interno del mio div ho provato a settare etrambi il valore per overflow ma non cambia nulla.
L'immagine all'interno viene sempre ridimensionata in base alle dimensioni del div e, impostando la proprietà ad hidden, non appaiono le barre di scorrimento.
E' come se overflow non avesse alcun effetto. Questo è il mio div

#headerBox_Main img.content {
    left: 0px;
    top: 0px;
    width: 770px;
    height: 200px;
    overflow: auto;
}

Grazie,
saluti

[mucu]

Questo è il mio div

#headerBox_Main img.content {
    left: 0px;
    top: 0px;
    width: 770px;
    height: 200px;
    overflow: auto;
}

no, questa è qualsiasi immagine con classe content che si trova in un elemento con id headerBox_Main
devi scrivere la regola del div e bastae lasciare l'immagine senza dimensioni o altro

[furbostandby]

L'overflow ti ho detto di applicarlo al div non all'immagine!!!

[skunkio]

C'è poco da agitarsi, ho incollato nel post la parte sbagliata...su firefox non c'è il risultato che tu ti aspetti ma l'img viene ridimensionata.
Attualmente ho un div body che contiene un altro div dove dentro c'è l'img. Incollo di seguito i due div:

body {
    background: #3B3A3A;
    font-family: verdana, sans-serif;
}

#headerBox_Main {
    position: relative;
    width: 770px;
    background: #000000;
    text-align: right;
    float: left;
    overflow: hidden;
}

#headerBox_Main img.content {
    left: 0px;
    top: 0px;
    width: 770px;
    height: 200px;
}

e questo è il mio listato

 
<div id="body">
    <div id="headerBox_Main">[img]./Images/bye_bye_summer.gif[/img]</div>
</div>

Saluti

[mucu]

se al div non dai un'altezza non ti coprirà niente
e poi
quei top e left applicati all'immagine non hanno senso in questo contesto

[skunkio]

Ok lo ammetto, ho fatto un casino io
Funziona perfettamente.

Grazie,
saluti