how do you shorten a breaks line height in html?

Question

I am trying to create a good heading for my fake webpage using the code:

<br>  
<h1>Adults For Kids</h1>  
<h2>Bring hope to those with none</h2>  
<br>

but when this runs there is too much space around the text, and whenth the breaks are not there there is not enough blank space so how do you shorten a breaks line height in html?

Instead of
tag use
tag and write custom css for the div like margin or padding. — Bharath Kumar, Sep 06 '17 at 05:10
Possible of duplicate. Please find the answer [here](https://stackoverflow.com/questions/1409649/how-to-change-the-height-of-a-br) — Miran Senanayaka, Sep 06 '17 at 05:11
I think it will help. br { margin: 5px 0; display: block; } Also can use setting line-height: line-height: 10px; — Deepak Patidar, Sep 06 '17 at 05:12

Peter Haddad · Accepted Answer · 2017-09-06T05:21:22.157

<br>  
<h1>Adults For Kids</h1>  
<h2>Bring hope to those with none</h2>  
<br>

Currently the <br> is not affecting the space between the <h1> and <h2>, it needs to be between the two elements so like this:-

<h1>Adults For Kids</h1>
<br>  
<h2>Bring hope to those with none</h2>

Or you can use padding example:-

<h1 style="padding-bottom:2px">Adults For Kids</h1>
<h2>Bring hope to those with none</h2>

There is padding-bottom, padding-top, padding-left, padding-right.

If you want space between <h1> and top of page you can do this:-

<h1 style="padding-bottom:2px; padding-top:5px">Adults For Kids</h1>
<h2>Bring hope to those with none</h2>

score 0 · Answer 2 · answered Sep 06 '17 at 05:14

As every tag of HTML comes with default properties of its own like margin and padding. You can use Meyer reset to set every thing to default.

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
 margin: 0;
 padding: 0;
 border: 0;
 font-size: 100%;
 font: inherit;
 vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
 display: block;
}
body {
 line-height: 1;
}
ol, ul {
 list-style: none;
}
blockquote, q {
 quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
 content: '';
 content: none;
}
table {
 border-collapse: collapse;
 border-spacing: 0;
}

Place this in your CSS code and every thing will be set to default like all the margin and paddings of the headings and paragraphs and line-heights of them. You should specify everything custom CSS.

how do you shorten a breaks line height in html?

2 Answers2