br line-height in safari und chrome leaving gap

Question

In meinem HTML habe ich ein div und innerhalb der div habe ich unterschiedliche vertikale Abstände zwischen Textzeilen. Ich erreiche dies, indem ich Brüche benutze und die Höhe definiere, d. H. <br /><br class="height5" /> oder height2 oder height10 oder was auch immer.

In meinem Sheet definiere ich es mag:

br.height2 {line-height: 2px;} br.height5 {line-height: 5px;}

Dies ist in IE6 + FF2 + Arbeits- und Opera, aber aus irgendeinem Grund gibt es große Lücken in Safari und Chrome (wie diese beiden Browser es ignorieren und nur regelmäßige Pausen anwenden). Ich habe versucht, mit größeren Zeilenhöhen wie 20px oder 30px zu testen und Safari und Chrome erkennen diese. Sie scheinen alles unter 5-10 Pixeln zu ignorieren.

Hilfe? Vielen Dank!

Answer 1

Diese Browser lesen möglicherweise Ihren Leerraum (Wagenrücklauf usw.) und stützen ihn mit einem Wert von & nbsp; Ich schlage vor, mehrere div-Tags zu verwenden und die divs mit den Attributen des unteren Rands des gewünschten Speicherplatzes zu formatieren.

<div style="margin-bottom: 2px">content</div> 
<div style="margin-bottom: 5px">content</div> 
<div>content</div> 

Answer 2

Das funktionierte auf Chrome (das content Attribut hat den Trick):

br { 
    content: " "; 
    display: block; 
    margin: 1em; 
} 

Answer 3

Ich weiß, das ist alt, aber meine Antwort ist Cross-Browser ohne br in einen Block

zu drehen

/* line height can be set to whatever you want*/ 
br {line-height: 0.1; content: " "} 

Answer 4

Versuchen Sie folgendes:

br { line-height: 1em; } 

oder:

br { margin-top: 2em; } 

Answer 5

Dies funktionierte für mich für Firefox und Chrom. Hab die Idee von @SamuelC und @anushr.

br{ 
    display: block; 
    line-height: 0.1; 
    content: " "; 
}