Allinea verticalmente i DIV floating

Ho una parte di un sito Web che sto creando che è la seguente:

You are logged in as Username • Log Out

Vorrei che il testo in topbar_right fosse centrato verticalmente su quello in topbar_left . Tuttavia, topbar_right non contiene sempre testo, ma può anche contenere un piccolo modulo, che viene visualizzato correttamente perché ha la stessa altezza di quello a sinistra.

Ecco il mio attuale CSS:

 #topbar { background-color: #5a87bf; padding: 10px 30px 10px 30px; margin-bottom: 10px; font-size: 9pt; } #topbar_left { float: left; } #topbar_right { float: right; } .clear { clear: both; } 

Qual è il modo migliore per raggiungere questo risultato?

Generalmente trovo che l’impostazione dell’altezza della linea sia di aiuto qui. qualcosa del genere potrebbe funzionare:

 #topbar_left, #topbar_right { line-height: 20px; } 

Puoi anche provare a manipolare la proprietà CSS con allineamento verticale . Leggi questo articolo su come usarlo correttamente

in bocca al lupo