Ciao e benvenuto 
Premessa: nello specifico, l'argomento è relativo a CSS; in sostanza, hai sbagliato sezione. Non preoccuparti però, per il momento ho segnalato al moderatore che provvederà a spostare la discussione.
Chiaramente puoi risolvere in vari altri modi, anche in base al codice che stai usando e che sarebbe stato opportuno mostrarci. Tra parentesi: in casi del genere, l'immagine non è sufficiente per capire come e dove intervenire; dovresti fornire il codice HTML e/o CSS inerente il problema o, meglio, postare un link dell'eventuale pagina pubblica dove è possibile verificare il problema.
Ad ogni modo provo a darti delle indicazioni, grossomodo è buona la soluzione proposta da carlomarangoni (senza nulla togliere) ma potresti definire tutto tramite css con l'uso del pseudo-elemento ::first-letter. Per la prima lettera avrai probabilmente definito un font-size espresso con un valore percentuale (tipo 250% o, magari 2.5em) o con qualche altra unità di misura. A questo punto dovrai azzerare la proprietà line-height per ::first-letter (similmente a quanto già ti è stato consigliato). Se ritieni opportuno, dovrai aggiungere un padding-top al contenitore (ad esempio il paragrafo) in modo da coprire l'altezza (maggiorata) della prima lettera che, diversamente, sborderebbe dal contenitore, avendo un'interlinea minore rispetto alla sua reale altezza.
Un esempio:
codice:
<!DOCTYPE HTML>
<html>
<head>
<title>Esempio</title>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<style type="text/css">
p {
width: 500px;
background: silver;
padding-top: 2em;
}
p:first-letter{
font-size: 3em;
line-height: 0;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</p>
</body>
</html>
Originariamente inviata da KillerWorm
Permessi di invio
Rispondi quotando
