Problem mit Linienhöhe und Ausrichtung

Question

Ich habe ein Element und es ist möglich, dass es länger als eine Zeile ist, also muss ich eine Linienhöhe> 1 festlegen, da es sonst beschissen aussieht. Aber wenn ich das tue, sind die Zeilen höher als der Text und der Text ist zentriert. Es passt also nicht zum Oberteil. Wie kann ich die Position des Textes in die Oberseite der Zeile ändern, oder gibt es eine andere Möglichkeit, einen Platz zwischen zwei Zeilen zu erhalten?

Answer 1

Line height by definition centers the font-size within the given line height. If you have a 12px font and a 16px line-height, the text will be centered within the 16px, leaving 2px on both the top and the bottom.

One solution to push this text up while maintaining the line height is to add a negative margin to the element and push it up negatively:

float: left;
margin-top: -2px;

Answer 2

Try this:

<style type="text/css">
.spacer
{
 line-height:1px;
}

.spacer:after
{
 content:".";
 visibility:invisible;
 line-height:1px;
}
</style>

You can increase the line height in the above CSS code there and use it like this:

your line one
<p class="spacer"></p>
your line two