br linii wysokości w safari i chromu pozostawiając luki

Question

W moim HTML mam div i wewnątrz div mam różne pionowe odstępy między wierszami tekstu. Osiągam to, stosując przerwy i określając wysokość, tj. <br /><br class="height5" /> lub wysokość2 lub wysokość10 lub cokolwiek innego.

W moim stylów zdefiniować to lubią:

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

To działa w IE6 + FF2 + i Opera, ale z jakiegoś powodu w Safari i Chrome są ogromne luki (jak te dwie przeglądarki ignorują to i stosują zwykłe przerwy). Próbowałem testować z większymi liniami o wysokości 20 lub 30 pikseli, a Safari i Chrome je rozpoznają. Wydaje się, że ignorują wszystko poniżej 5-10 pikseli.

Pomoc? Dzięki!

Answer 1

Te przeglądarki mogą czytać Twoje białe spacje (powrót karetki itp.) I podpierać je przy pomocy pewnego rodzaju wartości. Sugeruję użycie wielu znaczników div i stylizowanie elementów div z marginesowymi atrybutami spacji.

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

Answer 2

To działało na Chrome (atrybut content wystarczyły):

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

Answer 3

wiem, że to jest stary, ale moja odpowiedź tutaj jest cross-browser bez włączania br w bloku

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

Answer 4

Spróbuj tego:

br { line-height: 1em; } 

lub:

br { margin-top: 2em; } 

Answer 5

To zadziałało dla mnie zarówno dla firefox, jak i chrome. Wpadłem na pomysł z @SamuelC i @anushr.

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