text-align: right; non funziona per <label>

Question

Semplicemente non riesco a ottenere il testo per allineare a destra in un elemento <label>.

HTML

<div id="contact_form"> 
<label for="name" id="name_label">Name:</label> 
</div> 

CSS

#contact_form label { 
    text-align: right; 
} 

La mia pagina: http://freshbeer.lv/development/en/contact.php

È possibile visualizzare le etichette per nome, telefono, e-mail ecc ... sono allineati al a sinistra, ma ho bisogno che siano allineati a destra, quindi qualcuno potrebbe suggerire qualcosa?

Answer 1

Label è un elemento in linea - quindi, a meno che non sia definita una larghezza, la sua larghezza è esatta uguale a quella delle lettere. L'elemento div è un elemento di blocco quindi la sua larghezza è predefinita al 100%.

Si dovrà posizionare il text-align: right; sull'elemento div nel vostro caso, o l'applicazione di display: block; al tuo label

Un'altra opzione è quella di impostare una larghezza per ogni etichetta e quindi utilizzare text-align. Il metodo display: block non sarà necessario utilizzando questo.

Answer 2

È possibile allineare un testo a destra all'interno di qualsiasi elemento, incluse le etichette.

Html:

<label>Text</label> 

Css:

label {display:block; width:x; height:y; text-align:right;} 

In questo modo, vi darà una larghezza e l'altezza per l'etichetta e fare qualsiasi testo all'interno di esso adeguamento alla destra.