1

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?

Improve this question
5
  • "Type page no. here" is it an input field?
    – ruleboy21
    Commented Feb 5, 2022 at 2:15
  • Yes, with type="number".
    – K.K Designs
    Commented Feb 5, 2022 at 2:16
  • What you're describing isn't a line break. Just use margin.
    – ksav
    Commented Feb 5, 2022 at 2:21
  • @ksav How would I do that?
    – K.K Designs
    Commented Feb 5, 2022 at 2:22
  • Impossible to say given that there is no code in your question.
    – ksav
    Commented Feb 5, 2022 at 2:23

1 Answer 1

Reset to default
2

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.

Improve this answer
10
  • Not so sure if this would be a correct answer. First, you have a typo, which should be height, and second, I do not see a difference between 2 <br /> tags and this solution. Is there any other way to do this? Because sadly, this isn't working.
    – K.K Designs
    Commented Feb 5, 2022 at 2:07
  • @K.KDesgins Thanks for pointing the typo out I fixed it. Also, you can always change the values in the calc() function to make it so it is not the same size as 2 <br> elements.
    – Ethan
    Commented Feb 5, 2022 at 2:10
  • I did; the result isn't changing. I even changed it to line-height: calc(1rem + 5rem);, But it does not seem to change. Am I doing something wrong?
    – K.K Designs
    Commented Feb 5, 2022 at 2:13
  • @K.KDesgins I just played around with it. It worked when I inserted this (ㅤ) invisible character in the <p> element and then the line-height worked. So try that.
    – Ethan
    Commented Feb 5, 2022 at 2:24
  • @K.KDesgins Take a look at this site and view the code here
    – Ethan
    Commented Feb 5, 2022 at 2:32

Not the answer you're looking for? Browse other questions tagged or ask your own question.