capolettera su più righe

[Phelix]

Ciao a tutti,
vorrei creare dei paragrafi la cui prima lettera sia evidenziata e si estenda in altezza per 2 o 3 righe.
Usando questo codice ed assegnadolo ad uno <span> ottengo l'effetto voluto con Mozilla, mentre IE mi schiaccia il resto del paragrafo rendendolo illegibile.

.capolettera
{
float: left;
width: .7em;
font-size: 4em;
line-height: 83%;
color:#8CC63E;
}



Qualcuno potrebbe aiutarmi?

Grazie

[panta1978]

Originariamente inviato da Phelix
Ciao a tutti,
vorrei creare dei paragrafi la cui prima lettera sia evidenziata e si estenda in altezza per 2 o 3 righe.
Usando questo codice ed assegnadolo ad uno <span> ottengo l'effetto voluto con Mozilla, mentre IE mi schiaccia il resto del paragrafo rendendolo illegibile.

.capolettera
{
float: left;
width: .7em;
font-size: 4em;
line-height: 83%;
color:#8CC63E;
}



Qualcuno potrebbe aiutarmi?

Grazie

Prova ad usare un div, non uno span, in quanto la lettera grande non è un elemento in linea.

<div class="capolettera">L</div>orem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ullamcorper bibendum quam.

Puoi togliere il comando width=.7em, che è inutile.

Facci sapere.

[Phelix]

Grazie mille!
Mi sembra che funzioni abbastanza bene.

Nel frattempo avevo risolto abbastenza dignitosamente così:
p.capolettera:first-letter
{
float: left;
font-size: 4.2em;
font-weight:bold;
line-height: 110%;
margin-left:-5px;
padding-right:5px;
margin-top:-7px;
color:#8CC63E;
}