display: table e text-align diritto di non lavorare

Ho un html-struttura come questa:display: table e text-align diritto di non lavorare

<div class="campain"> 
    <div class="campainText"> 
     <a href="#"><h2>Ny app til iPhone og iPad</h2></a> 
     <a href="#"><h2>Tips og vinn</h2></a> 
    </div> 
    <div class="campainPicture"> 
     Picture goes here 
    </div><div class="clear"></div> 
</div>

E mi piacerebbe il campainText di essere di destra-align. Il css per questo elemento è questo:

font-family: 'Spinnaker', sans-serif; 
font-size: 17px; 
color: #FFFFFF; 
background-color: #A2AD00; 
display: table; 
padding: 4px; 
margin: 4px 4px 4px 4px; 
text-decoration: none;

So che il resto del css sta funzionando. Il problema è che il testo è allineato a sinistra se includo l'opzione tabella nel campo di visualizzazione. Non appena lo rimuovo, funziona come previsto. Ci sono soluzioni alternative per questo, o devo usare display: inline e tag <br />?

fonte

2011-10-14 OptimusCrime

violino: http://jsfiddle.net/xbNCZ/

"Tabella + text-align:right non funziona", perché un elemento di tabella non tende alla larghezza predefinita. Aggiungi width:100% per ottenere il risultato desiderato.

Before/After impostazione width:100%.

fonte

2011-10-14 10:00:39

Affinché l'allineamento del testo funzioni, è necessario impostare una larghezza sull'elemento, ma qualsiasi larghezza lo farà, non deve necessariamente essere al 100%. –

@ Jan-Henk Larghezze ridotte non produrranno il risultato desiderato. L'OP ha richiesto una larghezza che è uguale alla dimensione di un normale elemento 'div', che è' 100% '. –

Ho appena aggiunto questo commento come nota a margine per spiegare perché la proprietà text-align non ha funzionato, e questo perché non è stata impostata alcuna larghezza. Hai ragione che l'OP ha bisogno di una larghezza del 100%. –

display: table e text-align diritto di non lavorare

risposta

Problemi correlati