Allineamento inferiore immagine

[furly]

Buongiorno.

Allego dei files per poter spiegare il mio problema.

Sto lottando come un matto per poter allineare il bordo inferiore dell'immagine del leone (vedi files allegati) con il bordo inferiore dell'immagine a fianco della testata (vedi sempre files allegati).

Sicuramente sbaglio qualcosa, ma mi sembra che il files style.css sia a posto come margini e larghezza colonne.

Mi potete aiutare?
Grazie.

[Prill]

esempio (ho modificato i nomi perché con colonna1, colonna2 eccetera mi perdevo)

html:

<div id="content">
<div id="header">
<div id="left">
<?php include ('inc.menubar-a.php'); ?>
<div><img src="img-header-a.jpg" height="120" alt=""></div>
</div><!--fine prima colonna con menu e testata-->
<div id="right"><img src="img-leon-logo.png" height="150" alt=""></div><!--fine seconda colonna con immagine leone-->
</div><!--fine header-->
</div>

css modificato:

#content {color: #505050; margin: 0 auto; width: 900px; background: #fff;}

#header {width: 840px; margin: 0 auto; height:160px; overflow:hidden}

#left {width: 680px; float: left; margin: 0 10px 0 0; text-align: justify;}

#right {width: 150px; float: right; margin: 0; text-align: right;}

.nav {text-align: left; color: #7D8085; margin: 10px 0; padding: 0;}

aggiungi alle immagini anche la larghezza

[Prill]

fra le modifiche principali potrai vedere che i box flottanti sono stati inseriti in un div header in cui rispetto al tuo colonna1 ho eliminato i margini laterali di 30px assegnando un auto per centrarlo e ho aggiunto una altezza e un overflow:hidden che mi serve per interrompere il float (prima non interrotto, infatti lo sfondo non era visualizzato).
Degli altri cambiamenti potrai renderti conto confrontando il codice originale con questo (ho tolto anche il clear:both su nav)

[furly]

Grazie. Funziona perfettamente.
Una curiosità: io ho definito le colonne nel css come .colonna1, .colonna2, ecc. e richiamate nell'index come <div class="colonna1">.
Invece tu hai cambiato in #header / ID="header". C'è differenza? (a parte i nomi che devotenerli semplici perchè i files del sito sono condivisi...)

[Prill]

Ho usato degli id invece che delle classi, se devi applicare una regola a più elementi in una pagina allora sarà necessaria una classe. Per quanto riguarda i nomi dei selettori conviene usare nomi che ti permettano di identificare immediatamente il blocco interessato perché se dovrai fare modifiche non ti ci raccapezzerai più. Quindi colonna1 e colonna2 possono esser chiari se usati per due box affiancati, ciascuno con i propri contenuti, per i quali contenuti non sarà necessario specificare sempre un float a sinistra o a destra perché saranno vincolati al loro contenitore. Cosa che prima non accadeva

[furly]

Grazie molte.