Redimensionar foto em CSS

[Kandalf]

Pessoal eu estou aqui um bocadinho atrapalhado mas acho que o que quero fazer é fácil.
Tenho assim este codigo em css

#foto1 {
    margin-left: 186px;
    margin-top: 1px;
    background-image: url(images/1.jpg);
    width: 140px;
    height: 170px;
    border: 1px solid #000000;
}

Eu queria que isso fosse buscar a foto e que ela independentemente se o seu tamanho ser maior que 140 x 170 que ficasse com esse tamanho no site.

Mas o que me está a acontecer é que a foto fica do tamanho original mas eu só se vê um bocado da foto.

Será que existe alguma forma de as fotos ficarem automaticamente do tamanho que eu quero?

 

[SoundSurfer]

Esses tamanhos não se aplicam ao background, aplicam-se à class #foto1 ...
ou seja... isso só pode funcionar eventualmente se tiveres uma tag <img> a que dês a class foto1.

Em alternativa, só o CSS3 é que tem um propriedade para dar um tamanho ao background... não sei como é que está o seu suporte nos browsers de hoje.

 

[Kandalf]

Bem eu já vi que estava a fazer uma cena mal o css é para formatar o site mas as imagens acho que devo escolher mesmo no site propriamente dito.

Eu já tenho o site todo direitinho com o espaço para as fotos lado a lado tudo certinho mas quando coloco lá as fotos aquilo fica desfigurado.

vou por aqui um exemplo do código css que tenho e depois do html

#foto1 {
    margin-left: 140px;
    margin-top: 6px;
    width: 140px;
    height: 170px;
    border: 1px solid #000000;
}
#foto2 {
    margin-left: 152px;
    margin-top: -1px;
    width: 140px;
    height: 170px;
    border: 1px solid #000000;

depois no html

  <div id="foto1">
        <div id="foto2">
        </div>
  </div>

assim fica tudo direitinho mas quando meto as imagens assim

  <div id="foto1">
      <img src="images/1.jpg" alt="ima" width="140" height="170" border="0" />
        <div id="foto2">
           <img src="images/1.jpg" alt="ima" width="140" height="170" border="0" />
        </div>
  </div>

Quando faço isto a segunda imagem desce fica tipo escadinhas. Sei que isto pode estar um bocado confuso mas se alguem me desse uma ajuda agradecia muito

 

[OldMan]

Uma imagem às vezes ajudava

Mas tenta usar as classes #foto1 e #foto2 nas <img> em vez da <div>:

<img src="images/1.jpg" alt="ima" id="foto1" />
<img src="images/1.jpg" alt="ima" id="foto2" />

 

[Kandalf]

Problema resolvido. Fiz aqui umas invenções e ficou como eu queria certamente não deve ser a melhor maneira de fazer isto mas está bom.

Obrigado pela ajuda SoundSurfer e OldMan