Variazione altezza proporzionale alla larghezza di un elemento

[icobi]

vorrei far sì che l'altezza di un elemento/tag vari in modo proporzionale (mantenendo una proporzione ben definita) al variare della larghezza espressa in percentuale.

cioè:

.class(di un immagine) {
      width: 96%;
      margin-left: 2%;
      margin-right: 2%;
}

non specifico l'altezza, infatti questa sarà data dal rapporto con la larghezza
( es. img 200px X 100px | al 96% della larghezza dell'el. parent | larghezza= 96, altezza= 48 [semplice proporzione 200:96=100:x] )

ora veniamo alla domanda:

se non ho un'immagine che mi stabilisce il rapporto voluto, è possibile definirlo in qualche altro modo?

spero di essere stato più chiaro...è un po complicato da spiegare, soprattutto perchè non sono sicuro neanch'io di cosa sto chiedendo!

spero che qualche buon anima mi spieghi!

grazie!

[deep]

Non ho capito una mazza, ma così ad intuito... hai provato una cosa del genere?

.class {
  max-width: 96%;
  width: auto;
  height: auto;
}

[icobi]

es. 2 aticoli del main content:
HTML:

<article class="article">
  <figure class="images">[img]img/cascina_01.JPG[/img]</figure>
  <div class="article_title">
     <h3>Cascina</h3>
     

la nostra cascina nel suo insieme</p>
  </div>
</article>

<article class="article">
  <figure class="images">[img]img/photo_tartufo_01.JPG[/img]</figure>
  <div class="article_title">
     <h3>Tartufo</h3>
     

il tesoro culinario</p>
  </div>
</article>

CSS:

.article {
     clear: none; 
     float: left; 
     width: 100%; 
     height: auto; 
     margin-top: 2em; 
     margin-bottom: 2em; 
     background-color: #fff; 
     border-style: solid; 
     border-width: 2px; 
     border-color: #EAEAEA; 
}
.images {
	border-bottom-style: solid;
	border-bottom-width: 3px;
        border-bottom-color: #eaeaea;
}
.article_title {
	padding-left: 1em;
	padding-right: 1em;
	line-height: 1em;
	text-align: justify;
	overflow: hidden;
	height: 6em;
}

come noti sono le immagini a definire l'altezza di <figure>... volendo mettere un articolo senza immagini come faccio a definire l'altezza in modo che gli elementi restino tutti uguali al variare della finestra?
[ovviamente tutto ciò perchè ho delle fluid grids]

[icobi]

facciamo più semplicemente...

width: 12%;

height: uguale alla larghezza;

si può fare?