htmlcssnewline

Control the space the <br> tag gives html/css


I want to create a line break in HTML 5 but control how much spacing it puts.

This is how it looks with one <br /> tag:

Picture with one br tag

This is how it looks with two <br /> tags:

Picture with two br tags

I want to do something like a 1.5 line break. Could you please let me know if this is possible? If so, how?


Solution

  • You can do this using CSS. Instead of using a <br> tag use a <p> element instead and give it a unique class. Then with CSS make a rule set for that class and make this declaration: line-height: calc(1rem + .5rem).

    You can also use margin. Whether it is margin-top or margin-bottom.