I use
to insert blank lines on my webpage. What is an elegant way to do the equivalent of 20 - 40 of these? After formatting, each br tag is put on a separate line which make reading the file cumbersome.
asked Apr 20, 2012 at 16:13
5
min-height, margin and padding.
You can define CSS styles for that, like
.space { margin-top: 300px; }
And insert it wherever you want to...
Hope that helps...
answered Apr 20, 2012 at 16:16
devdRewdevdRew
4,3133 gold badges22 silver badges33 bronze badges
Old question, but evergreen.
If you really want to use multiple < br > tags, you can do so with
I find this useful when I want whitespace between paragraphs. Using Div tags to do that is a really bad overkill hack, sorry guys. :-]
answered May 4, 2018 at 9:02
ChiwdaChiwda
1,1125 gold badges28 silver badges49 bronze badges
use padding between divs or td's instead of
answered Apr 20, 2012 at 16:14
AlexAlex
5,84111 gold badges39 silver badges79 bronze badges
The question was It would be helpful if someone could explain why using multiple
is not recommended
It's better to use padding or margins on your elements to get the spacing you need. It's more precise [every browser can display the br differently]
margins and padding is more compatible to almost all browsers
answered Apr 20, 2012 at 18:35
skhuramsskhurams
2,0937 gold badges44 silver badges81 bronze badges
Most if not all of the HTML browsers ignore the typical line breaks and spaces that are in the source code such as “Enter”, multiple “spaces”, “tabs” etc. This means that the line breaks you see in the source code will not translate when the page gets rendered in the browser.
using html br tag
In order to insert line breaks, you will need to use br tag [
]. The br tag is an empty tag, which means you do not have a closing tag. The
tag inserts a single line break, so you can add multiple
tags if you
want multiple line breaks.
this paragraph has a line break here
and another here
but not here.
You could always increase the space between lines using the CSS, but the
tag is quite handy for one off line breaks that are not global. The
tag is supported by all browsers.
Although, not strictly a line break the tag inserts a line break before starting a new paragraph. So, if you are just inserting empty line breaks then you could judiciously use the [paragraph tag] to manage the lines as well.
using html pre tag
Another tag you could use is the tag. If you surround the text with pre tag, then it will display the text as it is written, by preserving the end of line [‘\n’] and tab [‘\t’] characters in the text. This is good way to display source code without having to litter the code with HTML tags.
one line second line third line
The advantage you have
here is that you can cover a specific block of text with out having to replace all end of line with
tags. Also, the text remains legible with in the source code.
using cascading style sheet [CSS]
If you are using css, then you can use the white-space property to configure how the end of line [\n] and tab [\t] are handled by the browser. If you want the browser to render the ‘\n’ then assign the white-space to pre-line ….
white-space: pre-line
Setting this to pre-wrap will render both the ‘\n’ and the ‘\t’
white-space: pre-wrap
There are other “quirky” ways to insert a line break using the CSS, but you should be able to use one of the above three methods to cover almost all of the use cases.
How do you add multiple lines in HTML?
How do you break a line twice in HTML?
[a self closed tag] or
[legacy code].