Testo HTML multisize a più righe con stessa larghezza?

Question

Un designer ha fatto un disegno molto carino che è piuttosto difficile da me applicare. Deve essere applicato ai titoli dei post di Wordpress, quindi dovrebbe funzionare con qualsiasi testo.

Quindi prima di spegnere l'idea, controllerò SO :).

I titoli devono essere multilinea, una o più parole per riga. Le linee saranno suddivisi utilizzando PHP secondo un dato algoritmo che conta i caratteri in più uniforme possibile le linee, per assomigliare a questo:

<h1> 
    <span>Lorem Ipsum</span> 
    <span>Dolor Sit</span> 
</h1> 

di font-size Ogni linea deve essere regolato in modo che sia una larghezza pari alla larghezza (fissa) di la casella h1. Inoltre, verrà utilizzato qualche valore di negazione line-spacing. Esso dovrebbe essere simile a questo:

posso permettermi di usare CSS3 e JS su questo.

Answer 1

Ho inserito la domanda dopo aver provato un paio di plugin che non hanno funzionato molto bene. Ma poi ho provato BigText.

HTML

<h1 id="bigtext"> 
    <div>Lorem Ipsum</div> 
    <div>Dolor Sit</div> 
</h1> 

CSS

#bigtext { 
    font-family:'Arial Black', sans-serif; 
    text-align: center; 
    width: 400px; 
    margin: 60px auto; 
    text-transform: uppercase; 
    line-height: 0.75; 
    letter-spacing: -3px; 
} 

JS

$("#bigtext").bigtext(); 

Ecco un JFiddle per vederlo in azione.